/* 일정관리 화면. 색·글자·간격은 tokens.css 가, 레일과 본문 틀은 platform-shell.css 가 소유한다.
   여기에는 일정 고유의 것만 둔다 — 역할 색, 달력 격자, 타임라인, 폴더 표.

   색만으로 뜻을 전하지 않는다: 업체는 역할 이름표를, 상태는 글자를 함께 쓴다(흑백 출력 요구). */

:root {
  /* 업체 역할 색. 사람이 고르지 않고 역할이 정한다(ver2 와 같은 태도). */
  --schedule-role-owner: #4b5563;
  --schedule-role-maintenance: #2b57e0;
  --schedule-role-developer: #2f7ed8;
  --schedule-role-builder: #c63a2f;
  --schedule-role-designer: #0b7a57;
  --schedule-role-appraiser: #b06f00;
  --schedule-role-legal: #7a4bd0;
  --schedule-role-other: #5c6577;

  /* 상태. 막대 색은 역할이 정하므로, 상태는 테두리와 글자로 드러낸다. */
  --schedule-status-planned: #5c6577;
  --schedule-status-progress: #0b7a57;
  --schedule-status-review: #b06f00;
  --schedule-status-delayed: #c63a2f;
  --schedule-status-done: #8a93a6;
  /* 전체 일정 카드 안 필터 칸의 폭. 레일(200px)보다 좁게 둔다 — 같은 폭이면 둘이 한 덩어리로 보인다. */
  --schedule-filter-w: 208px;
}

.schedule-body {
  background: var(--c-sunken);
  color: var(--c-ink);
  font-size: var(--t-body);
}

.schedule-main {
  display: flex;
  flex-direction: column;
  gap: var(--space-5);
  min-width: 0;
}

/* ---------- 레일 ---------- */
.schedule-sidebar {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  /* 격자 칸(.rail-nav) 안의 기본 최소 폭은 내용 폭이다 — 안 풀면 긴 폴더 이름 하나가
     레일 전체를 넓혀 가로 스크롤바가 생긴다. 이름은 안에서 말줄임으로 접힌다. */
  min-width: 0;
}

.schedule-nav {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.schedule-nav .nav-item {
  text-align: left;
  border: 0;
  background: none;
  border-radius: var(--r-control);
  padding: 8px 10px;
  font: inherit;
  color: var(--c-ink);
  cursor: pointer;
  min-height: 36px;
}

.schedule-nav .nav-item:hover { background: var(--c-navy-soft); }
.schedule-nav .nav-item.is-active { background: var(--c-navy-soft); font-weight: 700; }

.schedule-rail-section h5 {
  margin: 0 0 var(--space-2);
  font-size: var(--t-micro);
  letter-spacing: 0.04em;
  color: var(--c-faint);
  text-transform: uppercase;
}

/* 접히는 칸의 머리. 위 h5 자리를 대신하므로 같은 크기·같은 색이되 누를 수 있다. */
.schedule-rail-section-head {
  display: flex;
  align-items: center;
  gap: 4px;
  width: 100%;
  margin-bottom: 2px;
  border: 0;
  background: none;
  font: inherit;
  font-size: var(--t-micro);
  letter-spacing: 0.04em;
  color: var(--c-faint);
  cursor: pointer;
  padding: 5px 6px;
  border-radius: var(--r-control);
}

.schedule-rail-section-head:hover { background: var(--c-navy-soft); color: var(--c-muted); }
.schedule-rail-section-head:focus-visible { outline: 2px solid var(--c-action); outline-offset: -2px; }
.schedule-rail-caret { flex: 0 0 auto; width: 10px; text-align: center; }

.schedule-rail-section-label {
  flex: 1;
  min-width: 0;
  text-align: left;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.schedule-rail-section-count { flex: 0 0 auto; }

.schedule-rail-hint {
  margin: 0;
  font-size: var(--t-aux);
  color: var(--c-faint);
}

.schedule-rail-row {
  display: flex;
  align-items: center;
  gap: var(--space-1);
}

.schedule-rail-row.is-current { background: var(--c-navy-soft); border-radius: var(--r-control); }

.schedule-rail-link {
  /* 즐겨찾기 칸에서는 이 단추가 곧 한 줄이다 — flex 부모(구역 행)가 없으면 나란히 흘러
     "신길1구역  통합심의의 총괄"처럼 두 항목이 한 줄에 붙어 보였다. */
  display: block;
  width: 100%;
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-align: left;
  border: 0;
  background: none;
  font: inherit;
  color: var(--c-ink);
  padding: 6px 8px;
  border-radius: var(--r-control);
  cursor: pointer;
  min-height: 32px;
}

.schedule-rail-link:hover { background: var(--c-navy-soft); }

/* 즐겨찾기의 구역과 절차를 글자로 가른다(UR-178). 색만 다르면 흑백으로는 같은 줄이다. */
.schedule-rail-kind {
  display: inline-block;
  margin-right: 6px;
  padding: 0 5px;
  border-radius: var(--r-pill);
  border: 1px solid var(--c-line);
  font-size: var(--t-micro);
  line-height: 1.5;
  color: var(--c-muted);
}

.schedule-rail-kind.is-zone {
  border-color: transparent;
  background: var(--c-navy-soft);
  color: var(--c-navy);
  font-weight: 700;
}

.schedule-star {
  border: 0;
  background: none;
  cursor: pointer;
  font-size: var(--t-row);
  color: var(--c-faint);
  line-height: 1;
  padding: 4px;
  min-width: 28px;
}

.schedule-star[aria-pressed="true"] { color: var(--c-seal); }

@media (hover: hover) {
  /* 쓰지 않는 동안에는 자리까지 비운다 — visibility 로만 감추면 두 단추가 48px 을 계속 붙들고
     있어 2단 폴더부터 이름이 "조합설립 총…"으로 잘렸다. 뜰 때는 이름 위에 겹쳐 놓는다.
     별을 이미 단 줄은 상태라서 늘 자리에 있다. */
  .schedule-tree-row .schedule-tree-add,
  .schedule-tree-row .schedule-star[aria-pressed="false"] { display: none; }

  .schedule-tree-row:hover,
  .schedule-tree-row:focus-within { position: relative; }

  .schedule-tree-row:hover .schedule-tree-add,
  .schedule-tree-row:focus-within .schedule-tree-add,
  .schedule-tree-row:hover .schedule-star[aria-pressed="false"],
  .schedule-tree-row:focus-within .schedule-star[aria-pressed="false"] {
    display: block;
    position: absolute;
    top: 50%;
    translate: 0 -50%;
    background: var(--c-navy-soft);
    border-radius: var(--r-control);
  }

  .schedule-tree-row:hover .schedule-tree-add,
  .schedule-tree-row:focus-within .schedule-tree-add { right: 28px; }

  .schedule-tree-row:hover .schedule-star[aria-pressed="false"],
  .schedule-tree-row:focus-within .schedule-star[aria-pressed="false"] { right: 2px; }

  /* 겹쳐 뜬 단추가 건수를 반쯤 덮는다 — 마우스를 올린 줄에서는 건수를 잠깐 비운다(자리는 둔다). */
  .schedule-tree-row:hover .schedule-tree-count,
  .schedule-tree-row:focus-within .schedule-tree-count { visibility: hidden; }
}

/* ---------- 폴더 트리 ---------- */
.schedule-tree { display: flex; flex-direction: column; gap: 2px; }
.schedule-tree-group + .schedule-tree-group { margin-top: var(--space-3); }

.schedule-tree-group-toggle {
  border: 0;
  background: none;
  font: inherit;
  font-weight: 700;
  color: var(--c-ink);
  cursor: pointer;
  padding: 4px 0;
  text-align: left;
  width: 100%;
}

.schedule-tree-row {
  display: flex;
  align-items: center;
  gap: 2px;
  /* 레일은 200px 다 — 단계마다 12px 씩 밀면 4단에서 이름이 몇 글자 남지 않는다. */
  padding-left: calc(var(--depth, 0) * 9px);
  border-radius: var(--r-control);
  min-height: 32px;
}

.schedule-tree-row:hover { background: var(--c-navy-soft); }
.schedule-tree-row.is-current { background: var(--c-navy-soft); }

.schedule-tree-toggle {
  border: 0;
  background: none;
  cursor: pointer;
  width: 18px;
  color: var(--c-faint);
  font-size: var(--t-micro);
  padding: 0;
}

.schedule-tree-toggle.is-empty { visibility: hidden; }

.schedule-tree-name {
  flex: 1;
  text-align: left;
  border: 0;
  background: none;
  font: inherit;
  color: inherit;
  cursor: pointer;
  padding: 4px 2px;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.schedule-tree-fixed,
.schedule-tree-count {
  margin-left: 6px;
  font-size: var(--t-micro);
  color: var(--c-faint);
}

.schedule-tree-add {
  border: 0;
  background: none;
  cursor: pointer;
  color: var(--c-action);
  font-size: var(--t-row);
  padding: 2px 6px;
}

.schedule-tree-search {
  width: 100%;
  margin-bottom: var(--space-2);
  border: 1px solid var(--c-line);
  border-radius: var(--r-control);
  padding: 6px 8px;
  font: inherit;
  font-size: var(--t-aux);
}

/* ---------- 상단 한 줄 ---------- */
/* 회계 화면과 같은 자리·같은 순서다(구역 → 여백 → 오늘 → 주 동작). 스크롤해도 어느 구역을
   보고 있는지 놓치지 않게 위에 붙여 둔다. */
/* 회계(shell.css)의 `.workspace > .topbar` 와 같은 규칙이다 — 본문 칸 안에 들어앉고 칸 밖으로
   번지지 않는다. 음수 여백으로 기둥 끝까지 늘렸더니 셋째 열의 "앞으로 2주" 카드와 맞부딪쳤다. */
.schedule-topbar {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding: 14px 24px;
  margin: 0 0 var(--space-4);
  border-bottom: 1px solid var(--c-line);
  background: var(--c-ground);
}

.schedule-topbar .grow { flex: 1; }

.zone-switch { position: relative; }

.zone-switcher {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 40px;
  padding: 0 12px;
  border: 1px solid var(--c-line);
  border-radius: var(--r-control);
  background: var(--c-ground);
  font: inherit;
  color: var(--c-ink);
  cursor: pointer;
}

.zone-switcher:hover { background: var(--c-navy-soft); }
.zone-switcher[disabled] { cursor: default; background: none; border-color: transparent; padding-left: 0; }
.zone-switcher strong { font-weight: 700; }
.zone-switcher small { color: var(--c-muted); font-size: var(--t-micro); }

.zone-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--c-navy);
  flex: none;
}

.zone-menu {
  position: absolute;
  left: 0;
  top: calc(100% + 6px);
  z-index: 30;
  min-width: 200px;
  background: var(--c-ground);
  border: 1px solid var(--c-line);
  border-radius: var(--r-control);
  box-shadow: var(--shadow-card);
  padding: 4px;
  display: flex;
  flex-direction: column;
}

/* 구역 메뉴 한 줄 — 고르는 단추와 별. 레일의 구역 목록이 맡던 일이 여기로 왔다. */
.zone-menu-row { display: flex; align-items: center; }
.zone-menu-row .zone-menu-item { flex: 1; min-width: 0; }
.zone-menu-row .schedule-star { flex: 0 0 auto; margin-right: 4px; }

/* 전체 일정에서는 한 구역의 색을 들 수 없다 — 빈 동그라미로 둔다. */
.zone-dot.is-all { background: transparent; border: 2px solid var(--c-faint); }

.zone-menu-item {
  display: flex;
  align-items: center;
  gap: 8px;
  border: 0;
  background: none;
  font: inherit;
  font-size: var(--t-aux);
  text-align: left;
  padding: 9px 10px;
  border-radius: 6px;
  cursor: pointer;
  color: var(--c-ink);
  min-height: 40px;
}

.zone-menu-item:hover { background: var(--c-sunken); }
.zone-menu-item.is-current { background: var(--c-navy-soft); font-weight: 700; }

.schedule-topbar-meta { font-size: var(--t-aux); color: var(--c-muted); white-space: nowrap; }

.schedule-topbar-action {
  min-height: 40px;
  padding: 0 16px;
  border: 1px solid var(--c-action);
  border-radius: var(--r-control);
  background: var(--c-action);
  color: #fff;
  font: inherit;
  font-size: var(--t-aux);
  font-weight: 700;
  cursor: pointer;
}

.schedule-topbar-action:hover { background: var(--c-navy); border-color: var(--c-navy); }

/* ---------- 페이지 머리 ---------- */
.schedule-page-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: var(--space-4);
  justify-content: space-between;
}

.schedule-page-titles h1 {
  margin: 4px 0 6px;
  font-size: var(--t-amount);
  line-height: 1.15;
}

.schedule-eyebrow {
  margin: 0;
  font-size: var(--t-micro);
  letter-spacing: 0.06em;
  color: var(--c-faint);
  text-transform: uppercase;
}

.schedule-page-hint {
  margin: 0;
  color: var(--c-muted);
  font-size: var(--t-aux);
}

.schedule-page-actions { display: flex; gap: var(--space-2); flex-wrap: wrap; }

.schedule-page-actions button,
.schedule-toolbar button,
.schedule-export-actions button {
  border-radius: var(--r-control);
  border: 1px solid var(--c-line);
  background: var(--c-ground);
  color: var(--c-ink);
  font: inherit;
  font-size: var(--t-aux);
  padding: 9px 14px;
  cursor: pointer;
  min-height: 40px;
}

.schedule-page-actions button.primary {
  background: var(--c-action);
  border-color: var(--c-action);
  color: #fff;
  font-weight: 700;
}

.schedule-page-actions button:hover,
.schedule-toolbar button:hover { background: var(--c-navy-soft); }
.schedule-page-actions button.primary:hover { background: var(--c-navy); }

.schedule-spacer { flex: 1; }

/* ---------- 카드·표 ---------- */
.schedule-card {
  background: var(--c-ground);
  border-radius: var(--r-card);
  box-shadow: var(--shadow-card);
  padding: var(--space-4) var(--space-5) var(--space-5);
  min-width: 0;
  /* 좁은 화면에서 표가 카드 밖으로 삐져나가지 않게 — 카드 안에서 가로로 민다. */
  overflow-x: auto;
}

.schedule-card-head {
  display: flex;
  align-items: baseline;
  gap: var(--space-2);
  margin-bottom: var(--space-3);
}

.schedule-card-head h2 { margin: 0; font-size: var(--t-title); }
.schedule-card.is-empty { padding-bottom: var(--space-4); }
.schedule-card.is-empty .schedule-empty { margin: 0; }
.schedule-card-count { font-size: var(--t-aux); color: var(--c-faint); }

.schedule-empty {
  margin: var(--space-4) 0;
  color: var(--c-muted);
  font-size: var(--t-aux);
}

.schedule-note {
  margin: 0 0 var(--space-3);
  color: var(--c-muted);
  font-size: var(--t-aux);
}

/* 규칙이 이 구역에 붙는지 가르는 여섯 축(UR-185). 이름과 값을 한 줄씩 세워 무엇이 비었는지가
   먼저 보이게 한다. */
.schedule-conditions {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  gap: 6px var(--space-3);
  margin: 0 0 var(--space-3);
  font-size: var(--t-aux);
}

.schedule-conditions dt {
  color: var(--c-faint);
}

.schedule-conditions dd {
  margin: 0;
  color: var(--c-ink);
  font-weight: 600;
}

.schedule-conditions dd.is-empty {
  color: var(--c-seal);
  font-weight: 500;
}

/* 이 구역에 해당하지 않거나 채우지 않아도 되는 자리 — 붉게 물들이지 않는다. */
.schedule-conditions dd.is-none {
  color: var(--c-faint);
  font-weight: 500;
}

.schedule-note.is-warn {
  color: var(--c-seal);
}

/* 레일의 자동 일정 규칙 자리(UR-177). '준비 중' 문구 자리를 실제로 눌러 들어가는 길로 바꿨다. */
.schedule-rail-rules {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding: 8px 10px;
  border-radius: var(--r-control);
  color: var(--c-muted);
  font-size: var(--t-aux);
  text-decoration: none;
}

.schedule-rail-rules:hover,
.schedule-rail-rules.is-active {
  background: var(--c-navy-soft);
  color: var(--c-ink);
}

/* 규칙 목록 — 등급은 색만으로 전하지 않는다(흑백 출력). */
.schedule-rule-search {
  width: 100%;
  min-height: 36px;
  margin: 0 0 var(--space-3);
  padding: 0 10px;
  border: 1px solid var(--c-line);
  border-radius: var(--r-control);
  font: inherit;
  font-size: var(--t-aux);
}

/* 규칙 거르기(9월 11일 자료 PART 6 화면 A). 고르는 칸은 한 줄로 서다가 자리가 모자라면 줄을 바꾼다. */
.schedule-rule-filters {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: var(--space-2) var(--space-3);
  margin: 0 0 var(--space-2);
}

.schedule-rule-filter {
  display: grid;
  gap: 4px;
  min-width: 0;
  font-size: var(--t-micro);
  color: var(--c-muted);
}

.schedule-rule-filter select {
  min-height: 36px;
  padding: 0 8px;
  border: 1px solid var(--c-line);
  border-radius: var(--r-control);
  background: var(--c-ground);
  font: inherit;
  font-size: var(--t-body);
}

.schedule-rule-filter.is-search { flex: 1 1 200px; }
.schedule-rule-filter .schedule-rule-search { margin: 0; font-size: var(--t-body); }
.schedule-rule-filters > .schedule-link { min-height: 36px; }
.schedule-rule-count { margin: 0 0 var(--space-3); font-size: var(--t-aux); color: var(--c-muted); }

/* 사업절차별 묶음. 머리는 단추다 — 누르면 그 단계의 표를 접고 편다. */
.schedule-rule-group + .schedule-rule-group { margin-top: var(--space-3); }

.schedule-rule-group-head {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  width: 100%;
  padding: 8px 10px;
  border: 0;
  border-radius: var(--r-control);
  background: var(--c-sunken);
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.schedule-rule-group-head strong { font-size: var(--t-body); }
.schedule-rule-group-mark { flex: none; width: 1em; color: var(--c-muted); }

/* 묶음마다 표가 따로 선다. 열 폭을 정해 두지 않으면 묶음마다 열이 어긋나 세로로 훑을 수 없다. */
.schedule-rule-group .schedule-rule-table { table-layout: fixed; }
.schedule-rule-group .schedule-rule-table th:nth-child(1) { width: 26%; }
.schedule-rule-group .schedule-rule-table th:nth-child(2) { width: 18%; }
.schedule-rule-group .schedule-rule-table th:nth-child(3) { width: 22%; }
.schedule-rule-group .schedule-rule-table th:nth-child(4) { width: 16%; }
.schedule-rule-group .schedule-rule-table th:nth-child(5) { width: 8%; }
.schedule-rule-group .schedule-rule-table th:nth-child(6) { width: 10%; }
/* 한글은 음절마다 줄이 갈려 "재건 / 축", "조 / 합"이 됐다 — 낱말 단위로 가르고, 너무 긴 낱말만 자른다. */
.schedule-rule-group .schedule-rule-table td { word-break: keep-all; overflow-wrap: anywhere; }
.schedule-rule-table td[data-label="적용 조건"] { white-space: pre-line; }

.schedule-rule-table small {
  display: block;
  color: var(--c-faint);
  font-size: var(--t-micro);
}

.schedule-rule-kind {
  margin-left: 6px;
  padding: 1px 6px;
  border-radius: var(--r-pill);
  background: var(--c-navy-soft);
  font-size: var(--t-micro);
  /* 제목이 길어 줄이 바뀔 때 배지 안에서 글자가 갈리지 않게 한다('참 / 고'). */
  white-space: nowrap;
}

.schedule-rule-row {
  cursor: pointer;
}

.schedule-rule-row:hover,
.schedule-rule-row:focus-visible {
  background: var(--c-navy-soft);
}

/* 한 화면 문장 채우기(설계 10절 C) — 칸을 세로로 쌓고, 고른 관계에 따라 필요 없는 칸은 감춘다. */
.schedule-rule-form {
  display: grid;
  gap: var(--space-3);
}

.schedule-field {
  display: grid;
  gap: 6px;
  font-size: var(--t-aux);
  color: var(--c-muted);
}

/* display:grid 가 hidden 속성을 이긴다 — 관계에 따라 감추는 칸이 그대로 보였다. */
.schedule-field[hidden] {
  display: none;
}

.schedule-field select,
.schedule-field input {
  min-height: 38px;
  padding: 0 10px;
  border: 1px solid var(--c-line);
  border-radius: var(--r-control);
  font: inherit;
  font-size: var(--t-row);
  color: var(--c-ink);
}

.schedule-field-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: var(--space-2);
}

/* 기간범위는 숫자가 둘이다 — "며칠 이상 며칠 이내". */
.schedule-field-row.is-window {
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto auto;
  align-items: center;
}

.schedule-field-row [hidden] { display: none; }

/* 적용 조건 — 축마다 한 줄. 폰에서는 값이 다음 줄로 흐른다. */
.schedule-scope-box {
  margin: 0;
  padding: var(--space-3);
  border: 1px solid var(--c-line);
  border-radius: var(--r-control);
  display: grid;
  gap: var(--space-2);
}

.schedule-scope-box legend {
  padding: 0 6px;
  font-size: var(--t-aux);
  color: var(--c-muted);
}

.schedule-scope-box .schedule-note { margin: 0; }

.schedule-scope-row {
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  align-items: start;
  gap: var(--space-2);
}

.schedule-scope-axis {
  padding-top: 8px;
  font-size: var(--t-aux);
  color: var(--c-muted);
}

.schedule-scope-values {
  display: flex;
  flex-wrap: wrap;
  gap: 0 var(--space-4);
}

.schedule-scope-values .schedule-check {
  min-height: 36px;
  font-size: var(--t-body);
}

/* 지금 고른 값이 무슨 문장이 되는지 늘 보인다 — 저장하고 나서야 알면 늦다. */
.schedule-rule-preview {
  margin: 0;
  padding: 10px 12px;
  border-radius: var(--r-control);
  background: var(--c-sunken);
  font-size: var(--t-aux);
  color: var(--c-ink);
}

.schedule-grade {
  font-weight: 600;
}

.schedule-grade.is-confirmed { color: var(--c-income); }
.schedule-grade.is-estimated { color: var(--schedule-status-review); }
.schedule-grade.is-blocked { color: var(--c-seal); }
.schedule-grade.is-internal { color: var(--c-muted); }

/* 구역 적용 화면(2차 2단계). 상태는 색만으로 전하지 않는다 — 글자를 함께 쓴다(흑백 출력 요구). */
.schedule-anchor-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: var(--space-3);
  margin-bottom: var(--space-3);
}

.schedule-zone-rule-state {
  font-weight: 600;
}

.schedule-zone-rule-state.is-applied { color: var(--c-income); }
.schedule-zone-rule-state.is-added { color: var(--c-navy); }

/* 공통 규칙에서 가져오기 — 고를 것을 세로로 세우고, 왜 저절로 붙지 않았는지를 줄마다 적는다. */
.schedule-fetch-list { margin: 0; padding: 0; list-style: none; display: grid; gap: var(--space-2); }
.schedule-fetch-list .schedule-check { align-items: flex-start; }
.schedule-fetch-text { display: grid; gap: 2px; min-width: 0; }
.schedule-fetch-text small { color: var(--c-muted); font-size: var(--t-aux); }
.schedule-fetch-text .schedule-fetch-reason { color: var(--c-faint); font-size: var(--t-micro); }
.schedule-zone-rule-state.is-excluded { color: var(--c-muted); }
.schedule-zone-rule-state.is-stopped { color: var(--schedule-status-review); }
.schedule-zone-rule-state.is-off { color: var(--c-faint); }
.schedule-zone-rule-state.is-standby { color: var(--c-muted); }
.schedule-zone-rule-state.is-replaced { color: var(--c-faint); }

/* 짝 규칙(연장·긴급)은 기본 규칙 바로 아래에 들여 세운다 — 둘이 한 쌍임을 자리로 말한다. */
.schedule-rule-table tr.is-paired td:first-child,
.schedule-zone-rule-table tr.is-paired td:first-child {
  padding-left: var(--space-5);
}

.schedule-pair-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-4);
}

/* 편집기 안의 묶음은 저마다 display 를 정해 hidden 속성을 이긴다 — 구역 전용 규칙에서 감춘
   적용 조건이 그대로 보였다. 편집기 안에서는 hidden 이 늘 이기게 한다. */
.schedule-rule-form [hidden] { display: none; }

.schedule-pair-box {
  display: grid;
  gap: var(--space-3);
}

.schedule-pair-box:empty { display: none; }

.schedule-pair-preview { color: var(--c-muted); }

/* 수정본과 지난 판(UR-200). 규칙 상세 안의 한 묶음이다. */
.schedule-revision {
  margin-top: var(--space-3);
  padding-top: var(--space-3);
  border-top: 1px solid var(--c-line);
  display: grid;
  gap: var(--space-2);
}

.schedule-revision h3 {
  margin: 0;
  font-size: var(--t-body);
}

.schedule-version-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: var(--space-2);
}

.schedule-version-list li {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 4px var(--space-4);
}

.schedule-version-list li small {
  display: block;
  color: var(--c-muted);
  font-size: var(--t-aux);
}

.schedule-version-note {
  display: block;
  color: var(--schedule-status-review);
}

.schedule-zone-rule-actions {
  white-space: nowrap;
}

.schedule-preview-action {
  font-weight: 600;
}

.schedule-preview-action.is-create { color: var(--c-income); }
.schedule-preview-action.is-move { color: var(--schedule-status-review); }
.schedule-preview-action.is-keep { color: var(--c-muted); }
.schedule-preview-action.is-protected { color: var(--c-faint); }

/* 표 안에서 줄을 늘리지 않는 단추 — 링크처럼 보이되 실제로 누르는 것이다. */
/* 규칙 상세의 근거 줄 — 조문 이름 · 대조 상태 · 원문 보기 · 대조 단추가 한 줄에 선다. */
.schedule-rule-source { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; }
.schedule-rule-source + .schedule-rule-source { margin-top: 6px; }

.schedule-link-button {
  display: inline-block;
  padding: 0;
  border: 0;
  background: none;
  color: var(--c-navy);
  font: inherit;
  font-size: var(--t-aux);
  text-decoration: underline;
  cursor: pointer;
}

.schedule-zone-rule-actions .schedule-link-button + .schedule-link-button {
  margin-left: var(--space-2);
}

.schedule-muted {
  color: var(--c-faint);
}

/* 변경 묶음(2차 3단계). 줄마다 무엇을 할지 고르고, 경계를 넘는 선택은 그 줄 아래에서 말한다. */
.schedule-anchor-change {
  color: var(--schedule-status-review);
  font-size: var(--t-micro);
}

.schedule-card.is-review {
  border-left: 3px solid var(--schedule-status-review);
}

.schedule-decision,
.schedule-manual-date {
  min-height: 34px;
  padding: 0 8px;
  border: 1px solid var(--c-line);
  border-radius: var(--r-control);
  font: inherit;
  font-size: var(--t-aux);
  color: var(--c-ink);
}

.schedule-manual-date {
  margin-left: var(--space-2);
}

.schedule-change-name {
  font-weight: 600;
}

/* 경고는 색만으로 전하지 않는다 — 등급 글자를 함께 쓴다(흑백 출력 요구). */
.schedule-change-warning td {
  padding-top: 0;
  font-size: var(--t-aux);
  color: var(--c-muted);
}

.schedule-warning-level {
  font-weight: 700;
}

.schedule-warning-level.is-긴급 { color: var(--c-seal); }
.schedule-warning-level.is-주의 { color: var(--schedule-status-review); }
.schedule-warning-level.is-안내 { color: var(--c-muted); }

/* 조문 배지(설계 10절). 날짜만 보이고 근거가 없으면 사람이 그 날짜를 믿을 수도 의심할 수도 없다.
   색만으로 등급을 전하지 않는다 — 글자가 곧 조문 이름이다. */
.schedule-basis {
  display: inline-block;
  padding: 1px 7px;
  border-radius: var(--r-pill);
  font-size: var(--t-micro);
  font-weight: 600;
}

.schedule-basis.is-confirmed { background: var(--c-navy-soft); color: var(--c-navy); }
.schedule-basis.is-estimated { background: var(--c-sunken); color: var(--schedule-status-review); }
.schedule-basis.is-pending { background: var(--c-sunken); color: var(--c-faint); }
.schedule-basis.is-internal { background: var(--c-sunken); color: var(--c-muted); }

/* 등급을 글자로 적는다 — 추정은 색이 아니라 '추정'이라는 말로 전한다. */
.schedule-basis-grade {
  margin-left: 6px;
  font-size: var(--t-micro);
  font-weight: 700;
  color: var(--schedule-status-review);
}

/* 멈춘 규칙의 일정. 근거는 그대로 두고 '규칙 연결 해제'를 글자로 덧붙인다 — 이 날짜는 기준일을
   옮겨도 움직이지 않는다는 뜻이다. */
.schedule-basis-detached {
  margin-left: 6px;
  padding: 1px 7px;
  border: 1px dashed var(--c-faint);
  border-radius: var(--r-pill);
  font-size: var(--t-micro);
  font-weight: 600;
  color: var(--c-muted);
}

.schedule-basis-chip.is-detached { border-style: dashed; color: var(--c-muted); }

/* 행정청 처리기한. 조합의 기한으로 읽히지 않도록 '참고'를 글자로 적는다. */
.schedule-basis-reference,
.schedule-rule-kind.is-reference {
  margin-left: 6px;
  padding: 1px 7px;
  border: 1px solid var(--c-line);
  border-radius: var(--r-pill);
  background: var(--c-ground);
  font-size: var(--t-micro);
  font-weight: 700;
  color: var(--c-muted);
}

/* 달력·타임라인 막대 안의 짧은 조문 표시. 제목보다 먼저 잘리지 않게 제 폭을 지킨다. */
.schedule-basis-chip {
  flex: none;
  margin-left: 4px;
  padding: 0 5px;
  border-radius: var(--r-pill);
  background: var(--c-ground);
  border: 1px solid var(--c-line);
  font-size: var(--t-micro);
  font-weight: 600;
  line-height: 1.4;
  color: var(--c-navy);
  text-decoration: none;
}

.schedule-basis-chip.is-mark { margin-left: 2px; padding: 0 4px; }
.schedule-basis-chip.is-estimated { color: var(--schedule-status-review); }
.schedule-basis-chip.is-pending,
.schedule-basis-chip.is-internal { color: var(--c-muted); }

/* 사람이 넣은 기준일(9월 11일 자료의 '기준점'). 규칙이 계산한 날짜와 섞여 보이면 어느 쪽을
   고쳐야 하는지 알 수 없다 — 점선 테두리로 세우고, 색만으로 가르지 않도록 글자를 함께 쓴다. */
.schedule-bar.is-anchor,
.schedule-tl-bar.is-anchor {
  border: 1px dashed var(--c-navy);
  border-left: 3px solid var(--c-navy);
  background: var(--c-ground);
}

.schedule-bar.is-anchor .schedule-bar-tag { color: var(--c-navy); }
.schedule-status.is-anchor { color: var(--c-navy); border-style: dashed; }
.schedule-basis.is-anchor { background: var(--c-sunken); color: var(--c-navy); }
.schedule-basis-chip.is-anchor { color: var(--c-navy); border-style: dashed; }

.schedule-basis-quote small,
.schedule-basis-quote span { display: block; }
.schedule-basis-rule { display: block; margin-top: 2px; color: var(--c-muted); }
.schedule-zone-rule-origin,
.schedule-zone-rule-date strong { white-space: nowrap; }
.schedule-zone-rule-date small { display: block; }
.schedule-cell-basis { white-space: nowrap; }

.schedule-basis-quote {
  color: var(--c-muted);
  font-size: var(--t-aux);
}

/* 원문 대조 상태(후속: 조문 레지스트리). 색만으로 전하지 않는다 — 글자가 곧 상태다. */
.schedule-review { font-weight: 600; }
.schedule-review.is-confirmed { color: var(--c-income); }
.schedule-review.is-pending { color: var(--schedule-status-review); }
.schedule-review.is-rejected { color: var(--c-seal); }

.schedule-source-table small {
  display: block;
  color: var(--c-faint);
  font-size: var(--t-micro);
}

.schedule-eventdef-table small {
  display: block;
  color: var(--c-faint);
  font-size: var(--t-micro);
}

/* 표준 세부 절차 넣기 — 사업절차마다 한 묶음. 고르는 줄은 손가락으로 누를 수 있는 높이를 둔다. */
.schedule-standard-list {
  display: grid;
  gap: var(--space-3);
}

.schedule-standard-group {
  margin: 0;
  padding: var(--space-3);
  border: 1px solid var(--c-line);
  border-radius: var(--r-control);
  display: grid;
  gap: 2px;
}

.schedule-standard-group legend {
  padding: 0 6px;
  font-weight: 700;
  font-size: var(--t-aux);
}

.schedule-standard-group legend small,
.schedule-standard-group .schedule-check small {
  color: var(--c-faint);
  font-size: var(--t-micro);
  font-weight: 500;
}

.schedule-standard-group .schedule-check {
  min-height: 36px;
  font-size: var(--t-row);
}

/* 기한 알림 카드(설계 12절). 급한 것이 위로 오고, 등급은 색과 글자를 함께 쓴다. */
.schedule-alert-card {
  border-left: 3px solid var(--c-seal);
}

.schedule-alert-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.schedule-alert-list li {
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: var(--t-aux);
}

/* 등급과 일정 이름은 한 줄에. 단추는 기본이 가운데 정렬이라 왼쪽으로 붙여 준다. */
.schedule-alert-head {
  display: flex;
  align-items: baseline;
  gap: var(--space-2);
}

.schedule-alert-head .schedule-link-button {
  text-align: left;
  word-break: keep-all;
}

.schedule-alert-message {
  margin: 0;
  color: var(--c-muted);
  font-size: var(--t-micro);
}

/* 경고마다 사람이 남기는 표시. 확인한 경고는 목록에 남으므로, 누가 언제 확인했는지를 글자로 적는다. */
.schedule-alert-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--space-1) var(--space-3);
  margin-top: 2px;
}

.schedule-alert-actions .schedule-link-button { min-height: 28px; }
.schedule-alert-mark { font-size: var(--t-micro); font-weight: 600; color: var(--c-muted); }

.schedule-alert-resolved { margin-top: var(--space-3); padding-top: var(--space-2); border-top: 1px solid var(--c-line); }
.schedule-alert-resolved summary { cursor: pointer; font-size: var(--t-aux); color: var(--c-muted); }
.schedule-alert-resolved .schedule-alert-list { margin-top: var(--space-2); }

/* 카드가 무엇을 싣는지 적은 줄은 목록과 갈라 둔다 — 붙여 두면 마지막 알림처럼 읽힌다. */
.schedule-alert-foot {
  margin-top: var(--space-3);
  padding-top: var(--space-2);
  border-top: 1px solid var(--c-line);
}

.schedule-table small {
  display: block;
  color: var(--c-faint);
  font-size: var(--t-micro);
}

.schedule-table {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--t-aux);
}

.schedule-table th {
  text-align: left;
  font-size: var(--t-micro);
  color: var(--c-faint);
  font-weight: 600;
  padding: 6px 8px;
  border-bottom: 1px solid var(--c-line);
  white-space: nowrap;
}

.schedule-table td {
  padding: 10px 8px;
  border-bottom: 1px solid var(--c-line);
  vertical-align: top;
}

.schedule-table tbody tr:hover { background: var(--c-sunken); }
.schedule-table tbody tr:focus-visible { outline: 2px solid var(--c-action); outline-offset: -2px; }

.schedule-cell-name strong { display: block; font-size: var(--t-body); }
.schedule-cell-path,
.schedule-cell-name small { display: block; color: var(--c-muted); font-size: var(--t-micro); margin-top: 2px; }
/* 바로 위 `.schedule-cell-name small` 이 한 수 더 구체적이라, 같은 무게로 적어야 감춰진다. */
.schedule-cell-mobile,
.schedule-cell-name small.schedule-cell-mobile { display: none; font-style: normal; }
.schedule-cell-due,
.schedule-cell-subject,
.schedule-cell-assignee { white-space: nowrap; }
.schedule-cell-actions { white-space: nowrap; }

.schedule-menu { position: relative; display: inline-block; }

.schedule-menu-trigger {
  border: 0;
  background: none;
  font-size: var(--t-row);
  line-height: 1;
  color: var(--c-muted);
  cursor: pointer;
  padding: 6px 10px;
  border-radius: var(--r-control);
  min-height: 32px;
}

.schedule-menu-trigger:hover { background: var(--c-navy-soft); }

.schedule-menu-list {
  position: absolute;
  right: 0;
  top: 100%;
  z-index: 5;
  background: var(--c-ground);
  border: 1px solid var(--c-line);
  border-radius: var(--r-control);
  box-shadow: var(--shadow-card);
  padding: 4px;
  display: flex;
  flex-direction: column;
  min-width: 120px;
}

.schedule-menu-item {
  border: 0;
  background: none;
  font: inherit;
  font-size: var(--t-aux);
  text-align: left;
  padding: 8px 10px;
  border-radius: 6px;
  cursor: pointer;
  color: var(--c-ink);
  white-space: nowrap;
  min-height: 36px;
}

.schedule-menu-item:hover { background: var(--c-sunken); }
.schedule-menu-item.is-danger { color: var(--c-seal); }
.is-overdue { color: var(--c-seal); font-weight: 700; }

.schedule-chip {
  display: inline-block;
  padding: 3px 8px;
  border-radius: var(--r-pill);
  font-size: var(--t-micro);
  font-weight: 700;
  white-space: nowrap;
  background: var(--c-navy-soft);
  color: var(--c-navy);
}

.schedule-chip.is-overdue { background: var(--c-seal-soft); color: var(--c-seal); }
.schedule-chip.is-today { background: #e7f3ec; color: var(--c-income); }
.schedule-chip.is-check { background: #fdf4e3; color: #8a5a00; }

.schedule-status {
  display: inline-block;
  padding: 2px 8px;
  border-radius: var(--r-pill);
  font-size: var(--t-micro);
  border: 1px solid currentcolor;
  white-space: nowrap;
}

.schedule-status.is-planned { color: var(--schedule-status-planned); }
.schedule-status.is-in_progress { color: var(--schedule-status-progress); }
/* '보류'는 예전 '확인 필요' 자리를 그대로 쓴다. '지연'은 저장 값이 아니라 마감이 지난 미완료에
   화면이 붙이는 표시다(2026-09-22 회신 Q-113 ①). */
.schedule-status.is-on_hold { color: var(--schedule-status-review); }
.schedule-status.is-delayed { color: var(--schedule-status-delayed); }
.schedule-status.is-completed { color: var(--schedule-status-done); }
.schedule-status.is-archived { color: var(--c-faint); }
.schedule-status.is-active { color: var(--c-income); }

.schedule-link,
.schedule-link-strong {
  border: 0;
  background: none;
  font: inherit;
  font-size: var(--t-aux);
  color: var(--c-action);
  cursor: pointer;
  padding: 4px 6px;
  border-radius: var(--r-control);
}

.schedule-link-strong { font-weight: 700; color: var(--c-ink); padding-left: calc(var(--depth, 0) * 14px); }
.schedule-link:hover, .schedule-link-strong:hover { background: var(--c-navy-soft); }
.schedule-link.is-danger { color: var(--c-seal); }

/* ---------- 구역 홈 ---------- */
/* 네 숫자는 바로 아래 표를 요약한 것이라 같은 카드 안에 든다 — 따로 떠 있는 카드 넷이 아니라
   표를 좁히는 단추 넷이다(2026-09-21 사용자 지적: 카드 배치에 규칙이 없다). */
.schedule-metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0;
  margin: var(--space-3) 0 var(--space-4);
  border: 1px solid var(--c-line);
  border-radius: var(--r-card);
  overflow: hidden;
}

.schedule-metric {
  border: 0;
  border-left: 1px solid var(--c-line);
  border-top: 3px solid transparent;
  background: var(--c-ground);
  font: inherit;
  text-align: left;
  cursor: pointer;
  padding: var(--space-3) var(--space-4);
}

.schedule-metric:first-child { border-left: 0; }
.schedule-metric:hover:not(:disabled) { background: var(--c-sunken); }
.schedule-metric:disabled { cursor: default; color: var(--c-faint); }
.schedule-metric:disabled .schedule-metric-value { color: var(--c-faint); }
.schedule-metric.is-chosen { background: var(--c-navy-soft); border-top-color: var(--c-action); }
.schedule-metric.is-chosen.is-danger { border-top-color: var(--c-seal); }
.schedule-metric.is-chosen.is-warn { border-top-color: var(--schedule-status-review); }
.schedule-metric:focus-visible { outline: 2px solid var(--c-action); outline-offset: -2px; }

.schedule-metric-label { font-size: var(--t-aux); color: var(--c-muted); }
.schedule-metric-value { display: block; font-size: var(--t-figure); margin: 4px 0; }
.schedule-metric-value small { font-size: var(--t-aux); color: var(--c-faint); margin-left: 4px; font-weight: 400; }
.schedule-metric-hint { margin: 0; font-size: var(--t-micro); color: var(--c-faint); }
.schedule-metric.is-danger .schedule-metric-value { color: var(--c-seal); }
.schedule-metric.is-warn .schedule-metric-value { color: #8a5a00; }

.schedule-dashboard-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr);
  gap: var(--space-4);
  align-items: start;
}

.schedule-dashboard-column { display: flex; flex-direction: column; gap: var(--space-4); min-width: 0; }

.schedule-upcoming, .schedule-procedures, .schedule-childlist, .schedule-trash, .schedule-partner-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-2);
}

.schedule-upcoming-item, .schedule-procedure-row, .schedule-childlist-item {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  width: 100%;
  border: 0;
  background: none;
  font: inherit;
  text-align: left;
  cursor: pointer;
  padding: 8px;
  border-radius: var(--r-control);
  min-height: 44px;
}

.schedule-upcoming-item:hover, .schedule-procedure-row:hover, .schedule-childlist-item:hover { background: var(--c-sunken); }
.schedule-upcoming-date { font-size: var(--t-aux); color: var(--c-muted); white-space: nowrap; min-width: 72px; }
.schedule-upcoming-text, .schedule-procedure-text { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.schedule-upcoming-text small, .schedule-procedure-text small, .schedule-childlist-item small {
  color: var(--c-muted);
  font-size: var(--t-micro);
}

.schedule-procedure-bar {
  flex: 0 0 90px;
  height: 6px;
  border-radius: var(--r-pill);
  background: var(--c-navy-soft);
  overflow: hidden;
}

.schedule-procedure-fill { display: block; height: 100%; background: var(--c-income); }
.schedule-procedure-percent { font-size: var(--t-aux); color: var(--c-muted); min-width: 40px; text-align: right; }

.schedule-running {
  align-self: flex-start;
  margin-top: 2px;
  font-size: var(--t-micro);
  font-weight: 700;
  color: var(--c-income);
}

/* ---------- 전체 일정 ---------- */
/* 화면은 카드 하나다 — 위에 도구 줄, 아래에 [필터][본문] 두 칸. 필터 카드가 따로 떠 있고
   접기 링크가 카드 밖에 있던 배치를 접었다(2026-09-21 사용자 지적: 카드 배치에 규칙이 없다). */
.schedule-views-body {
  display: grid;
  grid-template-columns: var(--schedule-filter-w) minmax(0, 1fr);
  gap: var(--space-4);
  align-items: start;
}

/* 필터가 접히면 본문이 그 폭을 쓴다 — 간트는 넓을수록 읽힌다. */
.schedule-views-body:not(:has(.schedule-filter)) { grid-template-columns: minmax(0, 1fr); }

.schedule-filter {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
  padding-right: var(--space-4);
  border-right: 1px solid var(--c-line);
  position: sticky;
  top: var(--space-4);
  max-height: calc(100vh - 120px);
  overflow: auto;
}

/* 도구 줄의 필터 단추. 탭과 같은 높이·같은 모서리로 한 줄에 선다. */
.schedule-filter-button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 36px;
  padding: 0 12px;
  border: 1px solid var(--c-line);
  border-radius: var(--r-control);
  background: var(--c-ground);
  font: inherit;
  font-size: var(--t-aux);
  color: var(--c-ink);
  cursor: pointer;
}

.schedule-action-card .schedule-card-head { width: 100%; }

/* 한 표 안에서 업체를 가르는 머리 줄. 카드를 업체 수만큼 세우지 않기 위한 것이라
   표 머리(thead)보다 무겁고 폴더 줄보다 가볍다. */
.schedule-group-row th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: var(--c-sunken);
  text-align: left;
  padding: 10px var(--space-3);
  border-top: 1px solid var(--c-line);
  border-bottom: 1px solid var(--c-line);
}

.schedule-group-row:first-child th { border-top: 0; }
.schedule-group-row th strong { font-size: var(--t-row); }
.schedule-group-row th .schedule-card-count { margin-left: var(--space-2); }
.schedule-group-empty { color: var(--c-muted); font-size: var(--t-aux); padding: var(--space-3); }

/* 폴더 화면 도구 줄 — 왼쪽은 거르는 것, 오른쪽 끝은 이 화면 밖으로 나가는 것. */
.schedule-toolbar .schedule-spacer { flex: 1; }

/* 날짜는 "9월 21/일"로 접히면 안 된다 — 표가 좁아도 한 덩어리로 둔다. */
.schedule-cell-date { white-space: nowrap; width: 1%; }

.schedule-filter-button.is-open { background: var(--c-navy-soft); border-color: transparent; font-weight: 700; }
.schedule-filter-button-icon { color: var(--c-muted); }

.schedule-filter-button-count {
  min-width: 18px;
  padding: 0 5px;
  border-radius: var(--r-pill);
  background: var(--c-action);
  color: #fff;
  font-size: var(--t-micro);
  font-weight: 700;
  text-align: center;
}

.schedule-filter-head { display: flex; align-items: baseline; justify-content: space-between; gap: var(--space-2); }
.schedule-filter-head h3 { margin: 0; font-size: var(--t-row); }
.schedule-filter-section { display: flex; flex-direction: column; gap: 2px; }
.schedule-filter-group { margin-top: var(--space-3); }
.schedule-filter-group h4 { margin: 0 0 4px; font-size: var(--t-micro); color: var(--c-faint); }

.schedule-filter-row {
  display: flex;
  align-items: center;
  gap: 2px;
  padding-left: calc(var(--depth, 0) * 12px);
  min-height: 30px;
}

.schedule-filter-toggle {
  border: 0;
  background: none;
  cursor: pointer;
  width: 18px;
  color: var(--c-faint);
  font-size: var(--t-micro);
  padding: 0;
}

.schedule-filter-toggle.is-empty { visibility: hidden; }

.schedule-filter-label {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: var(--t-aux);
  cursor: pointer;
  min-width: 0;
}

.schedule-filter-label span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.schedule-views {
  background: var(--c-ground);
  border-radius: var(--r-card);
  box-shadow: var(--shadow-card);
  padding: var(--space-4);
  min-width: 0;
}

.schedule-views-head {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  flex-wrap: wrap;
  margin-bottom: var(--space-4);
}

/* 보기마다 다른 범위 컨트롤이 들어오는 자리. 비어 있으면 자리를 차지하지 않는다. */
.schedule-views-controls { display: contents; }
.schedule-tl-controls { display: contents; }

.schedule-view-tabs { display: inline-flex; background: var(--c-sunken); border-radius: var(--r-control); padding: 3px; }

.schedule-view-tabs button {
  border: 0;
  background: none;
  font: inherit;
  font-size: var(--t-aux);
  padding: 7px 14px;
  border-radius: 8px;
  cursor: pointer;
  color: var(--c-muted);
  min-height: 36px;
}

.schedule-view-tabs button.is-active { background: var(--c-ground); color: var(--c-ink); font-weight: 700; box-shadow: var(--shadow-card); }

.schedule-month-nav { display: inline-flex; align-items: center; gap: var(--space-2); }

.schedule-month-nav button {
  border: 1px solid var(--c-line);
  background: var(--c-ground);
  border-radius: var(--r-control);
  cursor: pointer;
  font: inherit;
  font-size: var(--t-aux);
  padding: 6px 10px;
  min-height: 34px;
}

.schedule-month-nav strong { min-width: 110px; text-align: center; }
.schedule-view-stage {
  min-width: 0;
  overflow: auto;
  /* 옆으로 밀 수 있다는 표시. 끝까지 밀면 그 쪽 그림자가 사라진다(배경을 내용에 붙여 둔다). */
  background:
    linear-gradient(to right, var(--c-ground), transparent) left center / 20px 100% no-repeat local,
    linear-gradient(to left, var(--c-ground), transparent) right center / 20px 100% no-repeat local,
    radial-gradient(farthest-side at 0 50%, rgba(15, 23, 42, 0.12), transparent) left center / 10px 100% no-repeat scroll,
    radial-gradient(farthest-side at 100% 50%, rgba(15, 23, 42, 0.12), transparent) right center / 10px 100% no-repeat scroll;
}

/* ---------- 월간 달력 ---------- */
/* 필터를 펴고 셋째 열까지 띄운 1440px 에서도 토요일 칸이 잘리지 않을 만큼만 잡는다. */
.schedule-calendar { min-width: 520px; }

.schedule-calendar-week {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
}

.schedule-calendar-week.is-head .schedule-calendar-headcell {
  padding: 6px 4px;
  font-size: var(--t-micro);
  color: var(--c-muted);
  text-align: center;
  border-bottom: 1px solid var(--c-line);
}

.schedule-calendar-headcell.is-sunday { color: var(--c-seal); }
.schedule-calendar-headcell.is-saturday { color: var(--c-action); }

/* 일정이 없는 주도 112px 은 연다 — 이름이 잘리지 않게 한 2026-09-16 시안 결정. */
.schedule-calendar-weekwrap {
  border-bottom: 1px solid var(--c-line);
  min-height: 112px;
  display: flex;
  flex-direction: column;
}

.schedule-calendar-cell {
  min-height: 34px;
  padding: 4px 6px;
  border-right: 1px solid var(--c-line);
}

.schedule-calendar-cell:last-child { border-right: 0; }
.schedule-calendar-cell.is-outside { background: var(--c-sunken); }
.schedule-calendar-cell.is-today .schedule-calendar-date {
  background: var(--c-action);
  color: #fff;
  border-radius: var(--r-pill);
  padding: 1px 7px;
}

.schedule-calendar-date { font-size: var(--t-aux); }
.schedule-calendar-cell.is-sunday .schedule-calendar-date { color: var(--c-seal); }
.schedule-calendar-cell.is-saturday .schedule-calendar-date { color: var(--c-action); }
.schedule-calendar-holiday { display: block; font-size: var(--t-micro); font-style: normal; color: var(--c-seal); }

.schedule-calendar-bars {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  grid-auto-rows: 24px;
  gap: 2px;
  padding: 0 2px 6px;
}

/* 앞 주에서 이어진 막대 표시. 이름표 자리를 대신한다. */
.schedule-bar-carry { flex: 0 0 auto; font-size: var(--t-micro); color: var(--c-faint); }

.schedule-bar {
  display: flex;
  align-items: center;
  gap: 4px;
  border: 0;
  border-left: 3px solid var(--role-color, var(--schedule-role-owner));
  background: color-mix(in srgb, var(--role-color, var(--schedule-role-owner)) 12%, #fff);
  border-radius: 4px;
  font: inherit;
  font-size: var(--t-micro);
  text-align: left;
  padding: 2px 6px;
  cursor: pointer;
  overflow: hidden;
  white-space: nowrap;
  min-width: 0;
}

.schedule-bar.is-completed { opacity: 0.6; text-decoration: line-through; }
.schedule-bar-tag {
  flex: none;
  font-weight: 700;
  color: var(--role-color, var(--schedule-role-owner));
}

.schedule-bar-title { overflow: hidden; text-overflow: ellipsis; }

/* ---------- 폰의 달력(UR-202) ----------
   한 달이 화면 폭 안에 들어오고, 날짜를 누르면 그날 걸린 일정이 아래에 나온다. */
.schedule-mcal {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 2px;
}

.schedule-mcal-head {
  padding: 4px 0;
  text-align: center;
  font-size: var(--t-micro);
  color: var(--c-muted);
}

.schedule-mcal-day {
  display: grid;
  justify-items: center;
  align-content: start;
  gap: 2px;
  min-height: 56px;
  padding: 4px 0;
  border: 0;
  border-radius: var(--r-control);
  background: none;
  font: inherit;
  color: var(--c-ink);
  cursor: pointer;
}

.schedule-mcal-date {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  font-size: var(--t-body);
}

.schedule-mcal-head.is-sunday,
.schedule-mcal-day.is-sunday .schedule-mcal-date { color: var(--c-seal); }
.schedule-mcal-head.is-saturday,
.schedule-mcal-day.is-saturday .schedule-mcal-date { color: var(--c-action); }
.schedule-mcal-day.is-outside { opacity: 0.45; }
.schedule-mcal-day.is-today .schedule-mcal-date { font-weight: 700; box-shadow: inset 0 0 0 1px var(--c-action); }
.schedule-mcal-day.is-selected { background: var(--c-navy-soft); }
.schedule-mcal-day.is-selected .schedule-mcal-date { background: var(--c-action); color: #fff; font-weight: 700; box-shadow: none; }

.schedule-mcal-marks { display: flex; gap: 2px; height: 5px; }
.schedule-mcal-dot { display: block; width: 5px; height: 5px; border-radius: 50%; }
.schedule-mcal-count { font-size: var(--t-micro); color: var(--c-muted); line-height: 1; }

.schedule-mcal-agenda {
  margin-top: var(--space-3);
  padding-top: var(--space-3);
  border-top: 1px solid var(--c-line);
}

.schedule-mcal-agenda h3 {
  display: flex;
  align-items: baseline;
  gap: var(--space-2);
  margin: 0 0 var(--space-2);
  font-size: var(--t-row);
}

.schedule-mcal-agenda h3 small { font-size: var(--t-micro); color: var(--c-faint); font-weight: 400; }
.schedule-mcal-agenda h3 .schedule-calendar-holiday { display: inline; }
.schedule-mcal-agenda .ssl-body .schedule-basis-chip { justify-self: start; align-self: flex-start; margin: 2px 0 0; }

/* ---------- 타임라인 ---------- */
.schedule-timeline { display: flex; flex-direction: column; gap: var(--space-3); }
.schedule-tl-header { display: flex; align-items: center; gap: var(--space-3); flex-wrap: wrap; }
.schedule-tl-nav { display: inline-flex; align-items: center; gap: var(--space-2); }

.schedule-tl-nav button {
  border: 1px solid var(--c-line);
  background: var(--c-ground);
  border-radius: var(--r-control);
  cursor: pointer;
  font: inherit;
  font-size: var(--t-aux);
  padding: 6px 10px;
  min-height: 34px;
}

.schedule-tl-scales { display: inline-flex; background: var(--c-sunken); border-radius: var(--r-control); padding: 3px; }

.schedule-tl-scales button {
  border: 0;
  background: none;
  font: inherit;
  font-size: var(--t-aux);
  padding: 6px 12px;
  border-radius: 8px;
  cursor: pointer;
  color: var(--c-muted);
  min-height: 34px;
}

.schedule-tl-scales button.is-active { background: var(--c-ground); color: var(--c-ink); font-weight: 700; }

.schedule-tl-trail { display: flex; align-items: center; gap: 2px; flex-wrap: wrap; font-size: var(--t-aux); }
.schedule-tl-trail-sep { color: var(--c-faint); }

.schedule-tl-grid {
  overflow-x: auto;
  border: 1px solid var(--c-line);
  border-radius: var(--r-card);
  --head-width: 150px;
}

.schedule-tl-axis { position: sticky; top: 0; z-index: 4; background: var(--c-ground); }

/* 행을 격자가 아니라 가로 배치로 둔다 — 격자 칸 안의 sticky 는 그 칸 폭만큼만 붙어 있어,
   오른쪽으로 스크롤하면 행 이름이 화면 밖으로 나갔다. */
.schedule-tl-axis-line,
.schedule-tl-row {
  display: flex;
  border-bottom: 1px solid var(--c-line);
  width: max-content;
  min-width: 100%;
}

.schedule-tl-head {
  flex: 0 0 var(--head-width);
  box-sizing: border-box;
  position: sticky;
  left: 0;
  /* 막대 제목도 sticky 라 같은 자리에서 겹친다 — 행 이름이 늘 위에 온다. */
  z-index: 3;
  background: var(--c-ground);
  border-right: 1px solid var(--c-line);
  padding: 8px 10px;
  font-size: var(--t-aux);
  display: flex;
  flex-direction: column;
  gap: 2px;
  border-left: 3px solid var(--role-color, transparent);
}

.schedule-tl-head small { color: var(--c-faint); font-size: var(--t-micro); }

.schedule-tl-head-button {
  border: 0;
  background: none;
  font: inherit;
  font-weight: 700;
  text-align: left;
  color: var(--c-ink);
  cursor: pointer;
  padding: 0;
}

.schedule-tl-track {
  position: relative;
  flex: 0 0 calc(var(--total-days) * var(--day-width));
  display: grid;
  grid-template-columns: repeat(var(--total-days), var(--day-width));
  grid-auto-rows: 28px;
  /* 칸 사이는 띄우지 않는다 — 날짜 칸마다 틈이 생기면 축과 막대가 날 수 대로 어긋난다. */
  column-gap: 0;
  row-gap: 2px;
  padding: 4px 0;
  /* 날짜 격자는 행마다 칸을 만들지 않고 배경으로 그린다 — 수천 칸을 DOM 으로 만들지 않는다. */
  background-image: repeating-linear-gradient(
    to right,
    var(--c-line) 0,
    var(--c-line) 1px,
    transparent 1px,
    transparent var(--day-width)
  );
}

.schedule-tl-axis-cell {
  grid-column: calc(var(--offset) + 1) / span var(--days);
  grid-row: 1;
  font-size: var(--t-micro);
  color: var(--c-muted);
  padding: 4px 6px;
  border-left: 1px solid var(--c-line);
  overflow: hidden;
  white-space: nowrap;
  text-align: center;
}

.schedule-tl-axis-cell small { display: block; color: var(--c-faint); }
.schedule-tl-axis-cell.is-current { color: var(--c-action); font-weight: 700; }
.schedule-tl-axis-cell.is-sunday { color: var(--c-seal); }
.schedule-tl-axis-cell.is-saturday { color: var(--c-action); }
.schedule-tl-axis-line.is-primary .schedule-tl-axis-cell { font-size: var(--t-aux); color: var(--c-ink); }

.schedule-tl-row { min-height: calc(var(--lanes, 1) * 30px + 8px); }

.schedule-tl-bar {
  grid-column: calc(var(--offset) + 1) / span var(--days);
  grid-row: calc(var(--lane) + 1);
  /* 하루짜리 일정도 눌러서 열 수 있어야 한다 — 년-월 눈금에서는 2px 밖에 안 된다. */
  min-width: 5px;
  border: 0;
  border-left: 3px solid var(--role-color, var(--schedule-role-owner));
  background: color-mix(in srgb, var(--role-color, var(--schedule-role-owner)) 14%, #fff);
  border-radius: 4px;
  cursor: pointer;
  font: inherit;
  font-size: var(--t-micro);
  text-align: left;
  white-space: nowrap;
  position: relative;
  display: flex;
  align-items: center;
  padding: 0;
}

/* 제목은 가로로 스크롤해도 막대 안에서 따라온다 — 막대 시작점이 왼쪽 밖으로 나가면
   이름이 함께 사라져 무엇인지 알 수 없었다(9월 4일 기획서 9.5). 자기 막대 밖으로는 못 나간다. */
.schedule-tl-bar-label {
  position: sticky;
  left: calc(var(--head-width) + 6px);
  /* 제목은 자기 막대를 넘지 않는다 — 막대가 화면 밖으로 나가면 제목도 함께 사라져야 한다. */
  max-width: 100%;
  padding: 0 6px;
  pointer-events: none;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* 좁은 막대는 이름을 오른쪽 바깥에 둔다 — 막대 안에 글자가 들어가지 않는다. */
.schedule-tl-bar-label.is-outside {
  position: absolute;
  left: 100%;
  margin-left: 5px;
  /* 바깥으로 나온 이름은 막대 폭에 묶이지 않는다 — 묶이면 5px 막대에서 한 글자만 남는다. */
  max-width: none;
  width: max-content;
  overflow: visible;
  z-index: 1;
  color: var(--c-muted);
}

.schedule-tl-bar-label.is-hidden { visibility: hidden; }

.schedule-tl-body { position: relative; }

/* 오늘 세로선. 행마다 그리지 않고 본문에 한 번만 둔다. */
.schedule-tl-body.has-today::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: calc(var(--head-width) + var(--today-offset) * var(--day-width));
  width: 2px;
  background: var(--c-action);
  opacity: 0.5;
  pointer-events: none;
  z-index: 1;
}

.schedule-tl-note { margin: 0; font-size: var(--t-micro); color: var(--c-faint); }

/* ---------- 목록 ---------- */
.schedule-list-toolbar {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  font-size: var(--t-aux);
  color: var(--c-muted);
  margin-bottom: var(--space-2);
}

.schedule-sort {
  border: 0;
  background: none;
  font: inherit;
  font-size: var(--t-micro);
  color: inherit;
  cursor: pointer;
  padding: 2px;
}

.schedule-sort-mark { margin-left: 4px; color: var(--c-action); }

/* ---------- 폴더 표 ---------- */
.schedule-toolbar { display: flex; gap: var(--space-2); flex-wrap: wrap; align-items: center; }

.schedule-search {
  flex: 1;
  min-width: 180px;
  border: 1px solid var(--c-line);
  border-radius: var(--r-control);
  padding: 9px 12px;
  font: inherit;
  font-size: var(--t-aux);
  min-height: 40px;
}

.schedule-folder-table tr.is-archived { color: var(--c-muted); }

/* 일정 건수는 숫자 한 칸, 즐겨찾기와 작업은 오른쪽 끝 — 머리글 폭만큼 칸을 벌리면 기간이 좁아진다. */
.schedule-cell-count { width: 1%; white-space: nowrap; }
.schedule-folder-table th:last-child,
.schedule-folder-table td:last-child,
.schedule-folder-table th:nth-last-child(2),
.schedule-folder-table td:nth-last-child(2) { width: 1%; white-space: nowrap; }

/* 폴더가 없는 협력업체 카드는 한 줄이면 된다 — 업체가 여럿이면 빈 카드가 화면을 다 먹는다. */
.schedule-card.is-empty { padding: var(--space-3) var(--space-4); }
.schedule-card.is-empty .schedule-card-head { margin-bottom: 2px; }
.schedule-card.is-empty .schedule-empty { margin: 0; font-size: var(--t-aux); }

/* 화면 위 폴더 검색은 표를 거르는 것이지 문장이 아니다 — 끝까지 늘리지 않는다. */
.schedule-toolbar .schedule-search { max-width: 280px; }
.schedule-crumbs { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; font-size: var(--t-aux); }
.schedule-crumb-subject { color: var(--c-muted); }

/* ---------- 창 ---------- */
.schedule-modal-overlay {
  position: fixed;
  inset: 0;
  background: rgb(19 26 42 / 45%);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--space-4);
  z-index: 40;
}

.schedule-modal {
  background: var(--c-ground);
  border-radius: var(--r-sheet);
  padding: var(--space-5);
  width: min(520px, 100%);
  max-height: calc(100vh - 48px);
  overflow: auto;
  box-shadow: var(--shadow-sheet);
}

.schedule-modal.is-wide { width: min(720px, 100%); }
.schedule-modal h2 { margin: 0 0 var(--space-2); font-size: var(--t-title); }
.schedule-modal-description { margin: 0 0 var(--space-4); color: var(--c-muted); font-size: var(--t-aux); }
.schedule-modal-body { display: flex; flex-direction: column; gap: var(--space-3); }

.schedule-modal-error {
  margin: var(--space-3) 0 0;
  color: var(--c-seal);
  font-size: var(--t-aux);
}

/* 본문이 길어도 확인·취소는 늘 보인다 — 참석자가 많으면 버튼이 화면 밖으로 밀렸다. */
.schedule-modal-actions {
  display: flex;
  justify-content: flex-end;
  gap: var(--space-2);
  margin-top: var(--space-4);
  flex-wrap: wrap;
  position: sticky;
  bottom: calc(var(--space-5) * -1);
  background: var(--c-ground);
  padding: var(--space-3) 0 0;
  border-top: 1px solid var(--c-line);
}

.schedule-modal-actions button {
  border: 1px solid var(--c-line);
  background: var(--c-ground);
  border-radius: var(--r-control);
  font: inherit;
  font-size: var(--t-aux);
  padding: 10px 16px;
  cursor: pointer;
  min-height: 44px;
}

.schedule-modal-actions button[data-action="confirm"] {
  background: var(--c-action);
  border-color: var(--c-action);
  color: #fff;
  font-weight: 700;
}

.schedule-modal-actions button.is-danger {
  background: var(--c-ground);
  border-color: var(--c-seal);
  color: var(--c-seal);
}

.schedule-modal-actions button[disabled] { opacity: 0.6; cursor: progress; }

.schedule-field { display: flex; flex-direction: column; gap: 4px; }
.schedule-field-label { font-size: var(--t-aux); color: var(--c-muted); }
.schedule-field-hint { font-size: var(--t-micro); color: var(--c-faint); }

.schedule-field input,
.schedule-field select,
.schedule-field textarea {
  /* 입력칸은 기본이 content-box 라 min-height 에 안쪽 여백이 더해져 64px 이 되고, select 만
     border-box 라 42px 이었다 — 한 줄에 나란히 두면 높이가 어긋난다. 기준을 맞춘다. */
  box-sizing: border-box;
  border: 1px solid var(--c-line);
  border-radius: var(--r-control);
  padding: 10px 12px;
  font: inherit;
  font-size: var(--t-body);
  min-height: 44px;
  background: var(--c-ground);
  color: var(--c-ink);
}

.schedule-field textarea { min-height: 72px; resize: vertical; }
/* 한쪽에만 설명이 붙으면 그 줄이 늘어나 다른 쪽 입력칸까지 같이 늘어났다 —
   칸은 제 높이로 두고 설명만 아래로 흐르게 한다. */
.schedule-field-pair {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-3);
  align-items: start;
}

.schedule-where {
  background: var(--c-sunken);
  border-radius: var(--r-control);
  padding: var(--space-3);
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.schedule-where small { color: var(--c-muted); font-size: var(--t-micro); }

.schedule-check { display: flex; align-items: center; gap: 8px; font-size: var(--t-aux); cursor: pointer; }
/* display:flex 가 hidden 속성을 이긴다 — 관계에 따라 감추는 줄이 그대로 보인다. */
.schedule-check[hidden] { display: none; }
.schedule-subform { display: flex; flex-direction: column; gap: var(--space-3); padding-left: var(--space-4); border-left: 2px solid var(--c-line); }
.schedule-attendees { display: flex; flex-direction: column; gap: 4px; }

.schedule-attendee-search {
  border: 1px solid var(--c-line);
  border-radius: var(--r-control);
  padding: 9px 12px;
  font: inherit;
  font-size: var(--t-aux);
  min-height: 40px;
}

.schedule-attendee-list {
  display: flex;
  flex-direction: column;
  gap: 2px;
  max-height: 168px;
  overflow: auto;
}

.schedule-attendee-add {
  display: flex;
  align-items: baseline;
  gap: 8px;
  border: 0;
  background: none;
  font: inherit;
  font-size: var(--t-aux);
  text-align: left;
  padding: 8px 10px;
  border-radius: var(--r-control);
  cursor: pointer;
  min-height: 38px;
}

.schedule-attendee-add:hover { background: var(--c-sunken); }
.schedule-attendee-add small { color: var(--c-faint); font-size: var(--t-micro); }

.schedule-chips { display: flex; flex-wrap: wrap; gap: 6px; }

.schedule-chip-person {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: var(--c-navy-soft);
  border-radius: var(--r-pill);
  padding: 4px 6px 4px 10px;
  font-size: var(--t-aux);
}

.schedule-chip-person.is-lead { background: #e7f3ec; }
.schedule-chip-person small { color: var(--c-income); font-size: var(--t-micro); font-weight: 700; }

.schedule-chip-remove {
  border: 0;
  background: none;
  cursor: pointer;
  color: var(--c-muted);
  font-size: var(--t-row);
  line-height: 1;
  padding: 2px 4px;
}

.schedule-detail { display: grid; grid-template-columns: 80px 1fr; gap: 8px var(--space-3); margin: 0; font-size: var(--t-aux); }
.schedule-detail dt { color: var(--c-muted); }
.schedule-detail dd { margin: 0; }

.schedule-trash li,
.schedule-partner-list li {
  display: flex;
  align-items: center;
  gap: var(--space-2);
  padding: 8px;
  border-bottom: 1px solid var(--c-line);
}

/* 휴지통은 지운 날로 묶는다(UR-178). */
.schedule-trash-day h3 {
  display: flex;
  align-items: baseline;
  gap: var(--space-2);
  margin: var(--space-3) 0 0;
  font-size: var(--t-aux);
  color: var(--c-muted);
}

/* 줄 끝의 접힌 작업. 창 안에서는 떠 있는 메뉴가 잘리므로 그 줄에서 옆으로 펼친다. */
.schedule-row-more { display: inline-flex; align-items: center; gap: 2px; }
.schedule-row-more > summary { list-style: none; }
.schedule-row-more > summary::-webkit-details-marker { display: none; }

.schedule-trash-text, .schedule-partner-text { flex: 1; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.schedule-trash-text small, .schedule-partner-text small { color: var(--c-muted); font-size: var(--t-micro); }

.schedule-partner-tag {
  align-self: flex-start;
  font-size: var(--t-micro);
  font-weight: 700;
  color: var(--role-color, var(--schedule-role-other));
}

.schedule-company-row { display: grid; grid-template-columns: 1.4fr 1fr auto auto; gap: var(--space-2); align-items: center; }
.schedule-company-row input { border: 1px solid var(--c-line); border-radius: var(--r-control); padding: 8px 10px; font: inherit; font-size: var(--t-aux); min-height: 40px; }

.schedule-toast {
  position: fixed;
  left: 50%;
  bottom: 28px;
  transform: translateX(-50%);
  background: var(--c-ink);
  color: #fff;
  padding: 10px 18px;
  border-radius: var(--r-pill);
  font-size: var(--t-aux);
  z-index: 60;
  box-shadow: var(--shadow-card);
}

.schedule-view-placeholder {
  background: var(--c-ground);
  border-radius: var(--r-card);
  box-shadow: var(--shadow-card);
  padding: var(--space-6);
  text-align: center;
  color: var(--c-muted);
}

/* ---------- 인쇄 ---------- */
.schedule-print-root { display: none; }

@media print {
  .app-shell, #schedule-modal-root { display: none !important; }
  .schedule-print-root { display: block; }
  .schedule-print-root h1 { font-size: 18px; margin: 0 0 4px; }
  .schedule-print-meta { font-size: 11px; color: #555; margin: 0 0 12px; }
  .schedule-print-root table { width: 100%; border-collapse: collapse; font-size: 10px; }
  .schedule-print-root th, .schedule-print-root td { border: 1px solid #999; padding: 4px 5px; text-align: left; vertical-align: top; word-break: break-word; }
  .schedule-print-root th { background: #eee; }
  @page { size: A4 landscape; margin: 12mm; }
}

/* ---------- 좁은 화면 ---------- */
@media (max-width: 1100px) {
  .schedule-dashboard-grid { grid-template-columns: minmax(0, 1fr); }
  /* 필터를 옆에 두기에 좁다 — 본문 위로 접어 올린다. 도구 줄의 필터 단추가 그대로 여닫는다. */
  .schedule-views-body { grid-template-columns: minmax(0, 1fr); }
  .schedule-filter {
    position: static;
    max-height: 320px;
    padding: 0 0 var(--space-4);
    border-right: 0;
    border-bottom: 1px solid var(--c-line);
  }
  /* 네 칸은 4·2·1 로만 접는다 — 3+1 로 갈라지면 한 칸이 외따로 남는다. */
  .schedule-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .schedule-metric:nth-child(3) { border-top-width: 3px; box-shadow: 0 -1px 0 var(--c-line); }
  .schedule-metric:nth-child(odd) { border-left: 0; }
}

@media (max-width: 720px) {
  .schedule-page-head { align-items: flex-start; }
  .schedule-page-titles h1 { font-size: var(--t-figure); }
  /* 폰에서는 구역 홈 표의 업체·담당자를 경로 아래 한 줄로 합친다(9월 4일 기획서 7.3).
     다른 표(목록·폴더)는 가로로 밀어서 본다 — 열을 감추면 비교가 안 된다. */
  .schedule-action-table .schedule-cell-subject,
  .schedule-action-table .schedule-cell-assignee,
  .schedule-action-table th:nth-child(3),
  .schedule-action-table th:nth-child(4) { display: none; }
  .schedule-action-table .schedule-cell-mobile { display: inline; color: var(--c-muted); }
  /* 목록은 밀지 않고 본다(UR-202). 기간·업체·경로는 일정명 아래에 적고, 상태와 근거만 옆에 둔다. */
  .schedule-list,
  .schedule-list tbody { display: block; min-width: 0; }
  .schedule-list thead,
  .schedule-list .schedule-cell-subject,
  .schedule-list .schedule-cell-path,
  .schedule-list .schedule-cell-date { display: none; }
  .schedule-list tr {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    gap: 2px var(--space-2);
    padding: 10px 2px;
    border-bottom: 1px solid var(--c-line);
  }
  .schedule-list td { display: block; padding: 0; border: 0; }
  .schedule-list .schedule-cell-name { font-size: var(--t-row); font-weight: 600; word-break: keep-all; }
  .schedule-list .schedule-cell-name .schedule-cell-mobile { display: block; font-weight: 400; color: var(--c-muted); font-size: var(--t-aux); }
  .schedule-list .schedule-cell-basis { grid-column: 1 / -1; white-space: normal; }
  .schedule-list .schedule-cell-basis:empty { display: none; }
  .schedule-tl-grid { --head-width: 104px; }
  .schedule-view-stage { -webkit-overflow-scrolling: touch; }
  .schedule-field-pair { grid-template-columns: 1fr; }
  .schedule-company-row { grid-template-columns: 1fr; }
  .schedule-modal { padding: var(--space-4); }

  /* 폰의 상단 한 줄. 구역 이름과 단추가 각각 세 줄로 접히던 자리다. */
  .schedule-topbar { gap: var(--space-2); padding: 10px 14px; }
  .schedule-topbar .zone-switcher { padding: 6px 10px; }
  .schedule-topbar .zone-switcher strong { white-space: nowrap; font-size: var(--t-aux); }
  .schedule-topbar .zone-switcher small { display: none; }
  .schedule-topbar-meta { white-space: nowrap; font-size: var(--t-micro); }
  .schedule-topbar-action { white-space: nowrap; padding: 8px 12px; }

  /* 폴더 표는 밀지 않고 본다 — 이름과 작업만 남기고 기간·일정은 이름 아래로 내린다.
     오른쪽 끝의 '새 항목'이 가로 스크롤 밖으로 밀려나면 폰에서는 아무것도 만들 수 없다. */
  .schedule-folder-table .schedule-cell-range,
  .schedule-folder-table .schedule-cell-count { display: none; }
  .schedule-folder-table .schedule-cell-name .schedule-cell-mobile { display: block; color: var(--c-faint); }
  /* 별 하나에 "즐겨찾기" 네 글자를 붙일 자리가 없다 — 글자는 읽어 주는 쪽에만 남긴다. */
  .schedule-folder-table th.schedule-cell-star { font-size: 0; color: transparent; }
  .schedule-folder-table th.schedule-cell-star::after {
    content: "★";
    font-size: var(--t-micro);
    color: var(--c-faint);
  }

  /* 규칙 이름이 길어 다섯 열로는 한 글자씩 접힌다 — 폰에서는 줄마다 카드로 펼친다(설계 10절).
     머리글 대신 각 칸의 data-label 이 무슨 값인지 말한다. */
  .schedule-zone-rule-table,
  .schedule-zone-rule-table tbody,
  .schedule-zone-rule-table tr,
  .schedule-zone-rule-table td { display: block; width: auto; }
  .schedule-zone-rule-table thead { display: none; }
  .schedule-zone-rule-table tr {
    padding: var(--space-3) 0;
    border-top: 1px solid var(--c-line);
  }
  .schedule-zone-rule-table tr:first-child { border-top: 0; }
  .schedule-zone-rule-table td {
    padding: 2px 0;
    border: 0;
  }
  .schedule-zone-rule-table td[data-label]:not([data-label=""])::before {
    content: attr(data-label) " ";
    display: inline-block;
    min-width: 88px;
    color: var(--c-faint);
    font-size: var(--t-micro);
  }
  .schedule-zone-rule-table .schedule-zone-rule-title {
    font-weight: 600;
    font-size: var(--t-row);
    /* 규칙 이름은 낱말 단위로 접는다 — 기본값은 '조합설립인 / 가 신청'처럼 글자 사이를 끊는다. */
    word-break: keep-all;
  }
  .schedule-zone-rule-table td small { display: inline; margin-left: 6px; }
  .schedule-zone-rule-table .schedule-zone-rule-actions { margin-top: 4px; white-space: normal; }
  /* 폰에서는 줄마다 카드라 들여 세울 자리가 없다 — 짝 규칙은 '연장'·'긴급' 글자가 말한다. */
  .schedule-zone-rule-table tr.is-paired td:first-child,
  .schedule-rule-table tr.is-paired td:first-child { padding-left: 0; }
  .schedule-zone-rule-date small { display: inline; }
  .schedule-zone-rule-table .schedule-version-note { display: block; }

  .schedule-change-table,
  .schedule-change-table tbody,
  .schedule-change-table tr,
  .schedule-change-table td { display: block; width: auto; }
  .schedule-change-table thead { display: none; }
  .schedule-change-table tbody tr { padding: var(--space-3) 0; border-top: 1px solid var(--c-line); }
  .schedule-change-table tbody tr:first-child { border-top: 0; }
  .schedule-change-table td { padding: 2px 0; border: 0; }
  .schedule-change-table td[data-label]:not([data-label=""])::before {
    content: attr(data-label) " ";
    display: inline-block;
    min-width: 76px;
    color: var(--c-faint);
    font-size: var(--t-micro);
  }
  .schedule-change-table .schedule-change-name { font-size: var(--t-row); word-break: keep-all; }
  .schedule-change-table .schedule-change-warning { padding-top: 0; border-top: 0; }

  /* 거르는 칸은 둘씩 세우고 검색은 한 줄을 다 쓴다 — 여섯 칸이 한 줄에 서면 옆으로 넘친다. */
  .schedule-rule-filters { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .schedule-rule-filter.is-search { grid-column: 1 / -1; }
  .schedule-rule-filters > .schedule-link { justify-self: start; }

  /* 규칙 표와 조문 표도 폰에서는 줄마다 카드로 펼친다 — 여섯 열은 한 글자씩 접힌다. */
  .schedule-rule-table,
  .schedule-rule-table tbody,
  .schedule-rule-table tr,
  .schedule-rule-table td { display: block; width: auto; }
  .schedule-rule-table thead { display: none; }
  .schedule-rule-table tbody tr { padding: var(--space-3) 0; border-top: 1px solid var(--c-line); }
  .schedule-rule-table tbody tr:first-child { border-top: 0; }
  .schedule-rule-table td { padding: 2px 0; border: 0; }
  .schedule-rule-table td[data-label]:not([data-label="규칙"])::before {
    content: attr(data-label) " ";
    display: inline-block;
    min-width: 76px;
    color: var(--c-faint);
    font-size: var(--t-micro);
  }
  .schedule-rule-table .schedule-rule-title { font-size: var(--t-row); word-break: keep-all; }

  .schedule-eventdef-table,
  .schedule-eventdef-table tbody,
  .schedule-eventdef-table tr,
  .schedule-eventdef-table td { display: block; width: auto; }
  .schedule-eventdef-table thead { display: none; }
  .schedule-eventdef-table tbody tr { padding: var(--space-3) 0; border-top: 1px solid var(--c-line); }
  .schedule-eventdef-table tbody tr:first-child { border-top: 0; }
  .schedule-eventdef-table td { padding: 2px 0; border: 0; }
  .schedule-eventdef-table td[data-label]:not([data-label="일정"])::before {
    content: attr(data-label) " ";
    display: inline-block;
    min-width: 72px;
    color: var(--c-faint);
    font-size: var(--t-micro);
  }

  .schedule-source-table,
  .schedule-source-table tbody,
  .schedule-source-table tr,
  .schedule-source-table td { display: block; width: auto; }
  .schedule-source-table thead { display: none; }
  .schedule-source-table tbody tr { padding: var(--space-3) 0; border-top: 1px solid var(--c-line); }
  .schedule-source-table tbody tr:first-child { border-top: 0; }
  .schedule-source-table td { padding: 2px 0; border: 0; }
  .schedule-source-table td[data-label]:not([data-label="조문"])::before {
    content: attr(data-label) " ";
    display: inline-block;
    min-width: 72px;
    color: var(--c-faint);
    font-size: var(--t-micro);
  }

  /* 폰에서 되찾는 자리 셋.
     ① 눈썹줄은 위 한 줄(구역)과 레일 머리(모듈 이름)가 이미 말한 것을 되풀이한다.
     ② 카드 머리의 단추가 오른쪽 끝으로 밀려 줄 하나를 통째로 쓰던 것을 왼쪽에 붙인다. */
  .schedule-eyebrow { display: none; }
  .schedule-card-head .schedule-topbar-action { margin-left: 0; }

  /* 한국어는 낱말 단위로 접는다 — 기본값은 '2/2건 완 / 료'처럼 글자 사이를 끊는다. */
  .schedule-main { word-break: keep-all; }

  /* 도구 줄이 필터·탭 / 달 이동 / 내보내기 세 줄로 접혔다. 달 이동과 내보내기를 한 줄에
     앉히려면 둘 다 줄여야 한다 — 달 이름은 '2026년 9월'이 들어갈 만큼만, 단추는 글자만큼만. */
  .schedule-views-head .schedule-spacer { display: none; }
  .schedule-views-head .schedule-export-actions { margin-left: auto; }
  .schedule-month-nav { gap: 4px; }
  .schedule-month-nav strong { min-width: 86px; font-size: var(--t-aux); }
  .schedule-month-nav button { padding: 0 8px; }
  .schedule-export-actions button { padding: 6px 10px; font-size: var(--t-micro); }

  /* 진행 현황 줄이 이름·기간·막대·퍼센트를 한 줄에 우겨 '0/1건 / 완료'로 끊겼다.
     막대와 퍼센트를 글 아래로 내려 폭을 다 쓰게 한다. */
  .schedule-procedure-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    row-gap: 6px;
  }
  .schedule-procedure-text { grid-column: 1 / -1; }
  .schedule-procedure-bar { flex: 1 1 auto; width: 100%; }
  .schedule-procedure-percent { min-width: 34px; }

  /* 제목·건수·단추가 한 줄에 다 들어가지 않는다 — 접되 단추는 통째로 둔다. */
  .schedule-card-head { flex-wrap: wrap; }
  .schedule-card-head .schedule-topbar-action { margin-left: auto; }
}

/* 폰에서는 이름표까지 넣을 자리가 없다 — 날짜만 남긴다. */
@media (max-width: 460px) {
  .schedule-topbar-meta { display: none; }
}

/* ---------- 셋째 열: 앞으로 2주 (UR-163) ---------- */
.schedule-side-card {
  background: var(--c-ground);
  border-radius: var(--r-card);
  box-shadow: var(--shadow-card);
  padding: var(--space-4);
}

.schedule-side-card h3 {
  margin: 0 0 var(--space-3);
  font-size: var(--t-row);
  display: flex;
  align-items: baseline;
  gap: var(--space-2);
}

.schedule-side-card h3 small { font-size: var(--t-micro); color: var(--c-faint); font-weight: 400; }
.schedule-side-empty { margin: 0; font-size: var(--t-aux); color: var(--c-muted); }
.schedule-side-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }

.schedule-side-item {
  display: grid;
  grid-template-columns: auto 3px minmax(0, 1fr) auto;
  align-items: center;
  gap: var(--space-2);
  width: 100%;
  border: 0;
  background: none;
  font: inherit;
  text-align: left;
  cursor: pointer;
  padding: 8px 6px;
  border-radius: var(--r-control);
  min-height: 44px;
}

.schedule-side-item:hover { background: var(--c-sunken); }

/* 셋째 열이 없는 폭에서는 이 카드가 본문 아래로 내려온다. 320px 칸에 맞춘 한 줄짜리 배치를
   그대로 늘리면 날짜와 D-day 사이가 텅 비므로, 남는 폭만큼 여러 줄을 나란히 세운다. */
@media (min-width: 900px) {
  #schedule-main > .schedule-side-card .schedule-side-list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    column-gap: var(--space-5);
  }
}
.ssl-when { font-size: var(--t-micro); color: var(--c-muted); white-space: nowrap; }
.ssl-bar { display: block; width: 3px; height: 24px; border-radius: 2px; }
.ssl-body { display: flex; flex-direction: column; min-width: 0; }
.ssl-body b { font-size: var(--t-aux); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ssl-body small { font-size: var(--t-micro); color: var(--c-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ssl-dday { font-size: var(--t-micro); color: var(--c-muted); white-space: nowrap; }