:root {
  --bg: #f4f6f8;
  --panel: #ffffff;
  --text: #20242a;
  --muted: #69727d;
  --line: #dce1e7;
  --primary: #2268a8;
  --primary-dark: #184d7e;
  --danger: #b42318;
  --ok: #157a4a;
  --soft: #eef5fb;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.site-url-duplicate-warning {
  padding: 12px 14px;
  border: 1px solid #edb25d;
  border-radius: 9px;
  background: #fff8e8;
  color: #7a4b00;
  font-size: 13px;
  line-height: 1.6;
}
.site-url-duplicate-warning a { margin-left: 8px; color: #9a4d00; font-weight: 700; text-decoration: underline; }

* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--text); }
a { color: var(--primary); text-decoration: none; }
button, input, textarea, select { font: inherit; }

.date-picker-shell {
  position: relative;
  display: block;
  width: 100%;
}
.inline-form .date-picker-shell,
.filter-bar .date-picker-shell,
.maintenance-toolbar .date-picker-shell {
  width: auto;
  min-width: 170px;
}
.date-picker-shell input {
  width: 100%;
  padding-right: 42px;
}
.date-picker-button {
  position: absolute;
  right: 8px;
  top: 50%;
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  border: 0;
  border-radius: 7px;
  background: #eef4f6;
  color: #386b77;
  cursor: pointer;
  transform: translateY(-50%);
  transition: background .15s ease, color .15s ease, transform .15s ease;
}
.date-picker-button:hover {
  background: #dcecf0;
  color: #1f5966;
}
.date-picker-button:active {
  transform: translateY(-50%) scale(.96);
}
.date-picker-panel {
  position: fixed;
  z-index: 3000;
  width: 292px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 18px 42px rgba(23,35,51,.18);
}
.date-picker-header {
  display: grid;
  grid-template-columns: 36px 1fr 36px;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
}
.date-picker-header strong {
  text-align: center;
  font-size: 14px;
}
.date-picker-header button,
.date-picker-day,
.date-picker-month {
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--text);
  cursor: pointer;
}
.date-picker-header button {
  height: 32px;
  color: var(--primary);
  font-size: 22px;
  line-height: 1;
}
.date-picker-header button:hover,
.date-picker-day:hover,
.date-picker-month:hover {
  background: var(--soft);
}
.date-picker-weekdays,
.date-picker-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 4px;
}
.date-picker-weekdays {
  margin-bottom: 5px;
}
.date-picker-weekdays span {
  color: var(--muted);
  text-align: center;
  font-size: 10px;
  font-weight: 700;
}
.date-picker-day {
  height: 34px;
  font-size: 12px;
}
.date-picker-day.is-outside {
  color: #a7b0b8;
}
.date-picker-day.is-selected,
.date-picker-month.is-selected {
  background: var(--primary);
  color: #fff;
  font-weight: 800;
}
.date-picker-month-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 6px;
}
.date-picker-month {
  height: 42px;
  font-size: 13px;
}
.date-picker-mobile-heading,.date-picker-mobile-actions,.date-picker-clear,.date-picker-backdrop,.date-picker-scroll-spacer { display: none; }

@media (max-width: 560px) {
  body.date-picker-open { overflow-x: hidden; }
  .date-picker-backdrop { position: fixed; z-index: 2999; inset: 0; display: block; background: rgba(20,29,38,.22); touch-action: none; overscroll-behavior: none; }
  .date-picker-scroll-spacer { display: block; width: 1px; pointer-events: none; }
  .date-picker-panel.is-mobile { inset: auto 0 0 !important; z-index: 3002; display: block; width: 100%; max-height: min(82vh,680px); padding: 0 16px calc(16px + env(safe-area-inset-bottom)); overflow-y: auto; border: 0; border-radius: 18px 18px 0 0; box-shadow: 0 -14px 38px rgba(20,29,38,.2); }
  .date-picker-mobile-heading { position: sticky; top: 0; z-index: 2; display: flex; justify-content: space-between; align-items: center; gap: 12px; margin: 0 -16px 12px; padding: 15px 16px 13px; border-bottom: 1px solid var(--line); background: #fff; }
  .date-picker-mobile-heading strong,.date-picker-mobile-heading small { display: block; }
  .date-picker-mobile-heading strong { color: var(--text); font-size: 16px; }
  .date-picker-mobile-heading small { max-width: calc(100vw - 76px); margin-top: 3px; overflow: hidden; color: var(--muted); font-size: 11px; white-space: nowrap; text-overflow: ellipsis; }
  .date-picker-mobile-close { flex: 0 0 auto; width: 36px; height: 36px; border: 0; border-radius: 50%; background: var(--soft); color: var(--text); font-size: 24px; line-height: 1; }
  .date-picker-panel.is-mobile .date-picker-header { margin-bottom: 12px; }
  .date-picker-panel.is-mobile .date-picker-header button { height: 42px; }
  .date-picker-panel.is-mobile .date-picker-day { height: 42px; font-size: 14px; }
  .date-picker-panel.is-mobile .date-picker-month { height: 48px; font-size: 14px; }
  .date-picker-clear { display: block; margin: 10px auto 4px; padding: 8px 12px; border: 0; background: transparent; color: var(--muted); font-size: 12px; font-weight: 700; }
  .date-picker-mobile-actions { position: sticky; bottom: calc(-16px - env(safe-area-inset-bottom)); z-index: 2; display: grid; grid-template-columns: 1fr 1.35fr; gap: 10px; margin: 4px -16px calc(-16px - env(safe-area-inset-bottom)); padding: 12px 16px calc(16px + env(safe-area-inset-bottom)); border-top: 1px solid var(--line); background: #fff; }
  .date-picker-mobile-actions .button { min-height: 44px; margin: 0; }
  form.date-picker-context-active { position: relative; z-index: 3001; margin-inline: -4px; padding: 8px; border: 2px solid var(--primary); border-radius: 10px; background: #fff; box-shadow: 0 5px 18px rgba(20,29,38,.16); }
  .step-list form.date-picker-context-active { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .step-list form.date-picker-context-active > input[name="name"] { grid-column: 1 / -1; }
  .step-list form.date-picker-context-active > .date-picker-field-start_date,.step-list form.date-picker-context-active > .date-picker-field-end_date { display: grid; grid-template-rows: auto 1fr; gap: 3px; min-width: 0; }
  .step-list form.date-picker-context-active > .date-picker-shell::before { content: attr(data-date-picker-label); color: var(--muted); font-size: 10px; font-weight: 700; }
  .step-list form.date-picker-context-active > .date-picker-shell input { min-width: 0; }
}

/* Project and task calendar */
.calendar-toolbar { display: grid; gap: 12px; margin-bottom: 14px; }
.calendar-month-nav { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 12px; }
.calendar-month-nav h2 { margin: 0; text-align: center; }
.calendar-filter { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.calendar-filter select { min-width: 180px; }
.calendar-project-selector { position: relative; min-width: 250px; }
.calendar-project-selector > summary { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 38px; padding: 7px 11px; border: 1px solid var(--line); border-radius: 7px; background: #fff; color: var(--text); font-size: 12px; font-weight: 700; cursor: pointer; list-style: none; }
.calendar-project-selector > summary::-webkit-details-marker { display: none; }
.calendar-project-selector > summary i { width: 7px; height: 7px; border-right: 2px solid var(--muted); border-bottom: 2px solid var(--muted); transform: rotate(45deg); }
.calendar-project-selector[open] > summary i { transform: rotate(225deg); }
.calendar-project-selector > div { position: absolute; z-index: 30; top: calc(100% + 6px); left: 0; width: min(430px,calc(100vw - 40px)); padding: 11px; border: 1px solid var(--line); border-radius: 9px; background: #fff; box-shadow: 0 14px 34px rgba(20,29,38,.17); }
.calendar-project-selector input[type="search"] { width: 100%; margin-bottom: 8px; }
.calendar-project-options { display: grid; gap: 3px; max-height: 270px; overflow-y: auto; overscroll-behavior: contain; }
.calendar-project-options label { display: grid; grid-template-columns: auto 9px minmax(0,1fr) auto; align-items: center; gap: 7px; padding: 7px 6px; border-radius: 6px; cursor: pointer; }
.calendar-project-options label:hover { background: var(--soft); }
.calendar-project-options input { width: auto; min-height: auto; margin: 0; }
.calendar-project-options b { min-width: 0; overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.calendar-project-options small { max-width: 120px; overflow: hidden; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.calendar-legend { display: flex; align-items: center; gap: 12px; color: var(--muted); font-size: 11px; }
.calendar-legend > span { display: inline-flex; align-items: center; gap: 5px; font-weight: 800; }
.calendar-legend > span::before { content: ''; width: 9px; height: 9px; border-radius: 3px; background: var(--production); }
.calendar-legend > span.spot::before { background: var(--spot); }
.month-calendar-wrap { padding: 0; overflow-x: auto; }
.month-calendar { display: grid; grid-template-columns: repeat(7,minmax(120px,1fr)); min-width: 840px; }
.month-calendar-weekday { padding: 8px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); color: var(--muted); text-align: center; font-size: 11px; }
.month-calendar-day { min-height: 126px; padding: 7px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); background: #fff; }
.month-calendar-day:nth-child(7n) { border-right: 0; }
.month-calendar-day > time { display: grid; place-items: center; width: 24px; height: 24px; margin-bottom: 5px; border-radius: 50%; font-size: 11px; font-weight: 800; }
.month-calendar-day.is-outside { background: #fafafa; }
.month-calendar-day.is-outside > time { color: #a8adaf; }
.month-calendar-day.is-today > time { background: var(--primary); color: #fff; }
.month-calendar-day > div { display: grid; grid-auto-rows: 27px; gap: 3px; }
.calendar-event { display: flex; align-items: center; gap: 5px; min-width: 0; padding: 3px 5px; border-radius: 4px; background: color-mix(in srgb,var(--event-color) 11%,#fff); color: var(--text); font-size: 9px; line-height: 1.25; }
.month-calendar-day .calendar-event { grid-row: var(--event-lane,auto); }
.calendar-event i { flex: 0 0 auto; width: 5px; height: 5px; border-radius: 50%; background: var(--event-color); }
.calendar-event.is-task i { width: 8px; height: 2px; border-radius: 2px; }
.calendar-event span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.calendar-event.is-project { border-left: 2px solid var(--event-color); font-weight: 800; }
.month-calendar-day .calendar-event.is-task { min-height: 27px; margin-inline: -8px; padding-inline: 8px; border-radius: 0; background: color-mix(in srgb,var(--event-color) 18%,#fff); }
.month-calendar-day .calendar-event.is-task.is-range-start,.month-calendar-day .calendar-event.is-task.is-week-start { margin-left: 0; border-radius: 5px 0 0 5px; }
.month-calendar-day .calendar-event.is-task.is-range-end,.month-calendar-day .calendar-event.is-task.is-week-end { margin-right: 0; border-radius: 0 5px 5px 0; }
.month-calendar-day .calendar-event.is-task.is-range-start.is-range-end { margin-inline: 0; border-radius: 5px; }
.month-calendar-day .calendar-event.is-task strong,.month-calendar-day .calendar-event.is-task small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.month-calendar-day .calendar-event.is-task strong { font-size: 9px; }
.month-calendar-day .calendar-event.is-task small { margin-top: 1px; color: color-mix(in srgb,var(--event-color) 72%,#20272b); font-size: 8px; }
.month-calendar-day .calendar-event.is-task { position: relative; cursor: grab; user-select: none; touch-action: none; }
.month-calendar-day .calendar-event.is-task:active,.month-calendar-day .calendar-event.is-task.is-dragging { cursor: grabbing; }
.month-calendar-day .calendar-event.is-task.is-dragging { z-index: 8; opacity: .72; box-shadow: 0 4px 12px rgba(20,29,38,.18); }
.month-calendar-day .calendar-event.is-task > i { display: none; }
.calendar-event-text.is-hidden { visibility: hidden; }
.calendar-resize-handle { position: absolute; z-index: 3; top: 3px; bottom: 3px; width: 7px; border-radius: 4px; background: color-mix(in srgb,var(--event-color) 76%,#fff); cursor: ew-resize; }
.calendar-resize-handle.is-start { left: 1px; }
.calendar-resize-handle.is-end { right: 1px; }
.calendar-drag-preview { position: fixed; z-index: 5000; min-width: 145px; padding: 7px 9px; border-radius: 6px; background: #20272b; color: #fff; font-size: 11px; font-weight: 800; pointer-events: none; box-shadow: 0 6px 18px rgba(20,29,38,.24); }
body.calendar-task-dragging { cursor: grabbing; user-select: none; }
.calendar-agenda-mobile { display: none; }

@media (max-width: 560px) {
  .calendar-toolbar { padding: 12px; }
  .calendar-month-nav { gap: 7px; }
  .calendar-month-nav h2 { font-size: 17px; }
  .calendar-filter { display: grid; grid-template-columns: 1fr auto; }
  .calendar-filter select { min-width: 0; width: 100%; }
  .calendar-filter .compact-check { grid-column: 1 / -1; }
  .calendar-project-selector { grid-column: 1 / -1; min-width: 0; }
  .calendar-project-selector > div { position: static; width: 100%; margin-top: 7px; box-shadow: none; }
  .calendar-project-options label { grid-template-columns: auto 9px minmax(0,1fr); }
  .calendar-project-options small { grid-column: 3; max-width: 100%; }
  .calendar-legend { align-items: flex-start; flex-wrap: wrap; gap: 7px 12px; }
  .calendar-legend small { flex-basis: 100%; }
  .month-calendar-wrap { display: none; }
  .calendar-agenda-mobile { display: grid; gap: 10px; }
  .calendar-agenda-day { display: grid; grid-template-columns: 58px minmax(0,1fr); gap: 10px; padding: 12px; }
  .calendar-agenda-day > time { color: var(--muted); font-size: 11px; font-weight: 800; }
  .calendar-agenda-day > div { display: grid; gap: 6px; }
  .calendar-agenda-day .calendar-event { padding: 7px 8px; font-size: 11px; }
  .calendar-agenda-day .calendar-event span,.calendar-agenda-day .calendar-event strong,.calendar-agenda-day .calendar-event small { display: block; }
  .calendar-agenda-day .calendar-event small { margin-top: 2px; overflow: hidden; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
}

.sidebar {
  position: fixed;
  inset: 0 auto 0 0;
  width: 232px;
  background: #172333;
  color: #fff;
  padding: 20px 16px;
}
.brand { display: flex; gap: 12px; align-items: center; margin-bottom: 28px; }
.brand-mark {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 8px;
  background: #2e9d64;
  color: #08231f;
  font-weight: 800;
  text-decoration: none;
}
.brand-mark:hover { transform: translateY(-1px); }
.brand small { display: block; color: #b7c4d4; margin-top: 3px; }
.sidebar nav { display: grid; gap: 6px; }
.nav-section {
  display: grid;
  gap: 4px;
  margin: 8px 0;
  padding: 8px 0;
  border-top: 1px solid rgba(255,255,255,.1);
  border-bottom: 1px solid rgba(255,255,255,.1);
}
.sidebar a {
  color: #d8e0ea;
  padding: 11px 12px;
  border-radius: 8px;
}
.sidebar a.is-active, .sidebar a:hover { background: rgba(255,255,255,.1); color: #fff; }
.category-nav {
  display: flex;
  align-items: center;
  gap: 8px;
}
.category-nav span {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: var(--category-color, #2e9d64);
  flex: 0 0 auto;
}
.completed-nav span { background: #9aa4af; }

.main { margin-left: 232px; padding: 28px; }
.auth-main { min-height: 100vh; display: grid; place-items: center; padding: 24px; }
.auth-card {
  width: min(480px, 100%);
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 28px;
  box-shadow: 0 20px 40px rgba(23,35,51,.08);
}
.install-card { width: min(860px, 100%); }
.auth-card h1 { margin: 0 0 8px; font-size: 26px; }
.auth-card p { color: var(--muted); margin: 0 0 22px; }

.page-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 20px;
}
.page-header h1 { margin: 0; font-size: 28px; letter-spacing: 0; }
.page-header p { margin: 6px 0 0; color: var(--muted); }
.history-back-bar { display: flex; margin: 0 0 14px; }
.history-back-button { display: inline-flex; align-items: center; gap: 7px; min-height: 34px; padding: 0 10px; border: 1px solid var(--line); border-radius: 8px; background: #fff; color: var(--muted); cursor: pointer; font-size: 12px; font-weight: 700; }
.history-back-button span { font-size: 20px; font-weight: 400; line-height: 1; }
.history-back-button:hover { border-color: #b5c8cc; background: #f8faf9; color: var(--text); }
.button-row { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.button-row form { margin: 0; }

.panel, .stat, .project-summary {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
}
.panel { padding: 18px; }
.panel h2 { margin: 0 0 14px; font-size: 18px; }
.split { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(320px, .9fr); gap: 18px; align-items: start; }
.stats-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-bottom: 18px; }
.billing-strip { margin-bottom: 18px; }
.billing-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 10px;
}
.billing-item {
  display: grid;
  gap: 3px;
  min-width: 0;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  color: var(--text);
  background: #fbfcfd;
}
.billing-item strong,
.billing-item span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.billing-item span { color: var(--muted); font-size: 13px; }
.dashboard-project-list {
  display: grid;
  gap: 10px;
}
.dashboard-project-item {
  display: grid;
  grid-template-columns: 104px minmax(180px, 1.6fr) minmax(120px, .9fr) minmax(160px, .9fr) minmax(80px, .7fr);
  align-items: center;
  gap: 10px;
  min-width: 0;
  padding: 12px 12px 12px 16px;
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: inset 5px 0 0 var(--category-color, #2e9d64);
  color: var(--text);
  background: #fff;
}
.dashboard-project-item strong,
.dashboard-project-item small,
.dashboard-worker {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.project-current-step { min-width: 160px; }
.project-current-step .current-step-badge { margin: 2px 4px 2px 0; }
.project-current-step small { color: var(--muted); }
.stat { padding: 18px; }
.stat span { color: var(--muted); display: block; }
.stat strong { font-size: 32px; }

.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 0 14px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  color: var(--text);
  cursor: pointer;
}
.button.primary { background: var(--primary); border-color: var(--primary); color: #fff; }
.button.primary:hover { background: var(--primary-dark); }
.button.danger { color: var(--danger); border-color: #f1b7b2; }
.button.ghost { background: transparent; }
.button.compact { min-height: 32px; padding: 0 10px; font-size: 13px; }
.button.icon-button { width: 40px; padding: 0; line-height: 1; color: var(--danger); }
.button.compact.icon-button { width: 32px; min-width: 32px; }
.trash-icon {
  display: inline-block;
  background: currentColor;
  width: 14px;
  height: 16px;
  -webkit-mask: url("data:image/svg+xml,%3Csvg width='142' height='161' viewBox='0 0 142 161' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.88002 34.69H139.79L141.62 21.88C141.82 20.5 141.4 19.1 140.49 18.04C139.58 16.98 138.25 16.38 136.85 16.38H95.84L94.41 4.25C94.13 1.82 92.07 0 89.63 0H53.01C50.57 0 48.51 1.83 48.23 4.25L46.8 16.38H4.82001C3.42001 16.38 2.09001 16.99 1.18001 18.04C0.270015 19.09 -0.149985 20.49 0.050015 21.88L1.88002 34.69Z' fill='black'/%3E%3Cpath d='M2.98001 42.3999L19.32 156.8C19.66 159.17 21.69 160.94 24.09 160.94H117.57C119.97 160.94 122 159.18 122.34 156.8L138.69 42.3999H2.98001ZM50.11 136.85H40.47V63.5999H50.11V136.84V136.85ZM75.65 136.85H66.01V63.5999H75.65V136.84V136.85ZM101.19 136.85H91.55V63.5999H101.19V136.84V136.85Z' fill='black'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg width='142' height='161' viewBox='0 0 142 161' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.88002 34.69H139.79L141.62 21.88C141.82 20.5 141.4 19.1 140.49 18.04C139.58 16.98 138.25 16.38 136.85 16.38H95.84L94.41 4.25C94.13 1.82 92.07 0 89.63 0H53.01C50.57 0 48.51 1.83 48.23 4.25L46.8 16.38H4.82001C3.42001 16.38 2.09001 16.99 1.18001 18.04C0.270015 19.09 -0.149985 20.49 0.050015 21.88L1.88002 34.69Z' fill='black'/%3E%3Cpath d='M2.98001 42.3999L19.32 156.8C19.66 159.17 21.69 160.94 24.09 160.94H117.57C119.97 160.94 122 159.18 122.34 156.8L138.69 42.3999H2.98001ZM50.11 136.85H40.47V63.5999H50.11V136.84V136.85ZM75.65 136.85H66.01V63.5999H75.65V136.84V136.85ZM101.19 136.85H91.55V63.5999H101.19V136.84V136.85Z' fill='black'/%3E%3C/svg%3E") center / contain no-repeat;
}
.button.full { width: 100%; margin-top: 10px; }
.text-danger { color: var(--danger); background: none; border: 0; cursor: pointer; padding: 0; }
.muted-link { display: inline-block; color: var(--muted); margin-top: 16px; }

.field { display: grid; gap: 6px; margin-bottom: 12px; }
.field span { font-size: 13px; color: var(--muted); }
input, select, textarea {
  width: 100%;
  min-height: 40px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  padding: 9px 11px;
}
textarea { min-height: 96px; resize: vertical; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 16px; }
.field-wide, .wide, .form-actions { grid-column: 1 / -1; }
.form-actions { display: flex; gap: 8px; }
.inline-form, .filter-bar { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-bottom: 16px; }
.inline-form input, .inline-form select, .filter-bar input, .filter-bar select { width: auto; min-width: 170px; }
.check { display: inline-flex; gap: 6px; align-items: center; color: var(--muted); }
.check input { width: auto; min-width: auto; min-height: auto; }
.plugin-paid-check { white-space: nowrap; }
.color-input {
  width: 52px;
  min-width: 52px;
  padding: 4px;
}
.color-swatch {
  display: inline-block;
  width: 24px;
  height: 24px;
  border-radius: 999px;
  background: var(--category-color, #2e9d64);
  border: 1px solid rgba(0,0,0,.12);
  vertical-align: middle;
}
.category-color-preview { display: inline-grid; grid-template-columns: repeat(4,18px); overflow: hidden; border: 1px solid rgba(0,0,0,.14); border-radius: 6px; vertical-align: middle; }
.category-color-preview i { width: 18px; height: 28px; background: color-mix(in srgb,var(--category-color,#2e9d64) 7%,#fff); }
.category-color-preview i:nth-child(2) { background: color-mix(in srgb,var(--category-color,#2e9d64) 42%,#fff); }
.category-color-preview i:nth-child(3) { background: color-mix(in srgb,var(--category-color,#2e9d64) 52%,#fff); }
.category-color-preview i:nth-child(4) { background: var(--category-color,#2e9d64); }
.category-edit-form {
  display: grid;
  grid-template-columns: minmax(160px, 1fr) 52px minmax(84px, auto) 76px minmax(120px, .5fr) auto auto auto auto;
  gap: 10px;
  align-items: center;
}
.category-edit-form code {
  color: var(--muted);
  background: #f0f3f6;
  border-radius: 6px;
  padding: 7px 9px;
}
.settings-help,
.category-order-status {
  margin: 8px 0 12px;
  color: var(--muted);
  font-size: 12px;
}
.category-order-status {
  min-height: 18px;
  margin-bottom: 0;
}
.category-sort-item.is-dragging {
  opacity: .45;
}
.category-drag-handle,
.status-drag-handle {
  width: 28px;
  min-height: 34px;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: 7px;
  background: #fff;
  color: #9aa4a7;
  cursor: grab;
  line-height: 1;
  letter-spacing: -3px;
}
.category-drag-handle:hover,
.status-drag-handle:hover {
  background: #edf5f5;
  color: var(--primary);
}
.category-drag-handle:active,
.status-drag-handle:active {
  cursor: grabbing;
}
.small-number {
  min-width: 0;
  width: 70px;
}
.status-settings-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
.status-settings-masonry {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-auto-rows: 1px;
  grid-auto-flow: row dense;
  gap: 16px;
}
.status-settings-masonry > .status-scope-panel {
  align-self: start;
}
.status-scope-panel {
  display: grid;
  gap: 14px;
}
.status-option-list {
  display: grid;
  gap: 8px;
}
.status-option-form {
  display: grid;
  grid-template-columns: 28px minmax(150px, 1fr) 52px minmax(88px, auto) auto auto auto;
  gap: 8px;
  align-items: center;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
}
.status-option-form.is-inactive {
  opacity: .58;
  background: #f8fafb;
}
.work-log-type-option-form.is-spot {
  grid-template-columns: 28px minmax(150px, 1fr) 118px auto auto auto;
}
.work-log-time-group {
  display: grid;
  gap: 3px;
  min-width: 112px;
}
.work-log-time-group > span {
  color: var(--muted);
  font-size: 9px;
  font-weight: 700;
}
.work-log-time-group select {
  width: 100%;
  min-width: 112px;
}
.work-log-type-add-form.is-spot {
  align-items: end;
}
.status-sort-item.is-dragging {
  opacity: .45;
  border-style: dashed;
}
.maintenance-group-sort-item {
  grid-template-columns: 28px minmax(140px, .7fr) minmax(180px, 1fr) auto auto auto;
}
.maintenance-group-sort-item.is-dragging {
  opacity: .45;
  border-style: dashed;
}
.template-settings-grid {
  align-items: start;
}
.template-scope-panel {
  align-content: start;
}
.template-add-form {
  display: grid;
  grid-template-columns: minmax(180px, .7fr) minmax(0, 1fr) auto;
  gap: 10px;
  align-items: end;
}
.template-add-form .field-wide {
  grid-column: auto;
}
.template-add-form textarea {
  min-height: 64px;
}
.template-text-form {
  display: grid;
  grid-template-columns: 28px minmax(160px, .7fr) minmax(150px, .6fr) minmax(0, 1fr) auto auto auto;
  gap: 8px;
  align-items: start;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}
.template-text-form.is-inactive {
  opacity: .58;
  background: #f8fafb;
}
.template-text-sort-item.is-dragging {
  opacity: .45;
  border-style: dashed;
}
.template-body-field textarea {
  min-height: 72px;
  resize: vertical;
}
.template-insert-panel {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 12px;
  border: 1px solid #d8e9e8;
  border-radius: 9px;
  background: #f6fbfa;
}
.template-insert-panel > div:first-child {
  display: grid;
  gap: 3px;
}
.template-insert-panel span {
  color: var(--muted);
  font-size: 12px;
}
.template-insert-panel .button-row {
  flex: 1;
  justify-content: flex-start;
}
.template-settings-link {
  white-space: nowrap;
  font-size: 12px;
  font-weight: 700;
}
.compact-check {
  white-space: nowrap;
}

.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; min-width: 720px; }
th, td { padding: 12px 10px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
th { color: var(--muted); font-size: 12px; font-weight: 700; }
small { color: var(--muted); }
.strong-link { font-weight: 700; color: var(--text); }
.row-actions { text-align: right; }
.project-row {
  box-shadow: inset 5px 0 0 var(--category-color, #2e9d64);
}
.category-badge {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 3px 10px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--category-color, #2e9d64) 55%, #ffffff);
  background: color-mix(in srgb, var(--category-color, #2e9d64) 18%, #ffffff);
  color: #1d2935;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}
.pill {
  display: inline-flex;
  border: 1px solid #b7d8f2;
  background: var(--soft);
  color: #154b73;
  border-radius: 999px;
  padding: 3px 9px;
  font-size: 12px;
}
.category-badge.is-solid {
  border-color: var(--category-color, #2e9d64);
  background: var(--category-color, #2e9d64);
  color: #fff;
}
.status-badges {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  align-items: center;
}
.status-form { margin: 0; }
.status-trigger {
  cursor: pointer;
  padding: 0;
  border: 0;
  background: transparent;
  text-align: left;
}
.status-trigger:hover {
  filter: saturate(1.3);
}
.status-selects {
  display: flex;
  gap: 6px;
  align-items: center;
  flex-wrap: wrap;
}
.status-select {
  min-width: 160px;
  min-height: 32px;
  padding: 4px 8px;
  font-size: 13px;
}

.project-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-bottom: 14px; }
.project-summary div { padding: 14px 16px; border-right: 1px solid var(--line); }
.project-summary div:last-child { border-right: 0; }
.project-summary span, .detail-grid span { color: var(--muted); font-size: 12px; display: block; margin-bottom: 4px; }
.project-summary strong { font-size: 17px; }
.spot-header-actions { display: flex; gap: 8px; align-items: start; }
.spot-more-actions { position: relative; }
.spot-more-actions > summary { display: flex; gap: 7px; align-items: center; cursor: pointer; list-style: none; }
.spot-more-actions > summary::-webkit-details-marker { display: none; }
.spot-more-actions[open] > summary { border-color: var(--primary); color: var(--primary); }
.spot-more-actions > div { position: absolute; z-index: 8; top: calc(100% + 6px); right: 0; display: grid; gap: 6px; width: 160px; padding: 8px; border: 1px solid var(--line); border-radius: 9px; background: #fff; box-shadow: 0 12px 30px rgba(37,54,58,.16); }
.spot-more-actions form,.spot-more-actions button { width: 100%; }
.spot-project-summary { display: grid; grid-template-columns: minmax(190px,.8fr) minmax(360px,2fr) minmax(110px,.5fr); align-items: stretch; margin-bottom: 16px; overflow: hidden; border: 1px solid #f0d8c8; border-radius: 9px; background: #fff8f3; }
.spot-project-summary > div { min-width: 0; padding: 15px 18px; border-right: 1px solid #f3dfd2; }
.spot-project-summary > div:last-child { border-right: 0; }
.spot-project-summary span { display: block; margin-bottom: 5px; color: #9b6340; font-size: 10px; font-weight: 700; }
.spot-summary-primary { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 3px 10px; }
.spot-summary-primary > span { grid-column: 1 / -1; }
.spot-summary-primary > strong { color: var(--spot); font-size: 28px; }
.spot-summary-statuses { display: flex; justify-content: flex-end; align-items: center; gap: 5px; flex-wrap: wrap; }
.spot-summary-breakdown { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); }
.spot-summary-breakdown > div { padding: 0 15px; border-right: 1px solid #f3dfd2; }
.spot-summary-breakdown > div:first-child { padding-left: 0; }
.spot-summary-breakdown > div:last-child { padding-right: 0; border-right: 0; }
.spot-summary-breakdown strong,.spot-summary-date strong { display: block; font-size: 17px; }
.spot-summary-date { display: grid; align-content: center; }
.spot-billing-notice { display: flex; justify-content: space-between; align-items: center; gap: 14px; margin-bottom: 14px; padding: 13px 15px; border: 1px solid #f3cbb7; border-radius: 9px; background: #fff7f2; }
.spot-billing-notice strong,.spot-billing-notice span { display: block; }
.spot-billing-notice strong { color: #9f4828; font-size: 13px; }
.spot-billing-notice span { margin-top: 3px; color: var(--muted); font-size: 11px; }
.spot-overview-hero { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 14px; padding: 20px 22px; border: 1px solid #f0d8c8; border-radius: 9px; background: linear-gradient(120deg,#fff6ef,#fff); }
.spot-overview-hero small { color: var(--spot); font-size: 9px; font-weight: 800; letter-spacing: .12em; }
.spot-overview-hero h2 { margin: 4px 0 5px; font-size: 20px; }
.spot-overview-hero p { margin: 0; color: var(--muted); font-size: 12px; }
.spot-overview-title { min-width: 0; }
.spot-title-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.spot-title-row h2 { min-width: 0; overflow-wrap: anywhere; }
.spot-total-time { text-align: right; }
.spot-total-time strong,.spot-total-time span { display: block; }
.spot-total-time strong { color: var(--spot); font-size: 34px; }
.spot-total-time span { color: var(--muted); font-size: 10px; }
.spot-time-kpis { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: 10px; margin-bottom: 14px; }
.spot-time-kpis > div { padding: 13px 15px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.spot-time-kpis span,.spot-time-kpis strong { display: block; }
.spot-time-kpis span { color: var(--muted); font-size: 10px; }
.spot-time-kpis strong { margin-top: 5px; font-size: 18px; }
.spot-time-kpis.compact { grid-template-columns: repeat(5,minmax(0,1fr)); }
.spot-overview-actions { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-top: 14px; }
.spot-overview-actions h2 { margin: 0 0 4px; }
.spot-overview-actions p { margin: 0; color: var(--muted); font-size: 12px; }
.billing-status { display: inline-flex; padding: 4px 8px; border-radius: 999px; background: #edf1f0; color: #5c6866; font-size: 10px; font-weight: 800; white-space: nowrap; }
.billing-status.is-unbilled { background: #fff0e8; color: #ad5124; }
.spot-new-company-fields { padding: 14px; border: 1px solid #f0d8c8; border-radius: 8px; background: #fff8f3; }
.spot-new-company-fields small { display: block; margin-top: 8px; color: var(--muted); font-size: 11px; }
.inline-form-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.project-site-composer { display: grid; align-content: start; gap: 7px; min-width: 0; }
.project-site-composer > .field { min-width: 0; }
.project-new-site { border: 1px dashed color-mix(in srgb,var(--primary) 30%,var(--line)); border-radius: 8px; background: color-mix(in srgb,var(--primary) 4%,#fff); }
.project-new-site > summary { padding: 9px 12px; color: var(--primary-dark); font-size: 12px; font-weight: 700; cursor: pointer; list-style: none; }
.project-new-site > summary::-webkit-details-marker { display: none; }
.project-new-site[open] > summary { border-bottom: 1px solid color-mix(in srgb,var(--primary) 18%,var(--line)); }
.project-new-site-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; padding: 11px 11px 0; }
.project-new-site > small { display: block; padding: 8px 11px 11px; color: var(--muted); font-size: 10px; line-height: 1.5; }
.tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--line); margin-bottom: 16px; overflow-x: auto; }
.tabs a { color: var(--muted); padding: 12px 14px; border-bottom: 3px solid transparent; white-space: nowrap; }
.tabs a.is-active { color: var(--primary); border-color: var(--primary); }
.detail-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.detail-grid p { margin: 0; line-height: 1.7; }
.project-command-panel { margin-bottom: 16px; padding: 14px 16px; border: 1px solid var(--line); border-radius: 10px; background: linear-gradient(135deg,#fff 0%,#fbfcfc 100%); }
.project-command-panel .section-heading { margin-bottom: 10px; }
.project-command-panel .section-heading small,.project-overview-workspace .section-heading small,.project-basic-info .section-heading small { display: block; margin-bottom: 3px; color: var(--primary); font-size: 9px; font-weight: 800; letter-spacing: .12em; }
.project-command-kpis { display: grid; grid-template-columns: 1fr 1fr 1.15fr 1.2fr; border-top: 1px solid var(--line); border-left: 1px solid var(--line); border-radius: 8px; overflow: hidden; }
.project-command-kpis > div { min-width: 0; padding: 9px 13px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); background: #fff; }
.project-command-kpis span { display: block; margin-bottom: 4px; color: var(--muted); font-size: 10px; }
.project-command-kpis strong { display: inline-block; font-size: 15px; }
.project-command-kpis small { margin-left: 6px; color: var(--muted); font-size: 10px; }
.project-command-kpis .is-overdue strong { color: #d54d36; }
.project-command-progress i { display: block; height: 5px; margin-top: 5px; border-radius: 6px; background: #e8eceb; overflow: hidden; }
.project-command-progress i b { display: block; height: 100%; border-radius: inherit; background: var(--primary); }
.project-overview-workspace { display: grid; grid-template-columns: minmax(0,1.25fr) minmax(320px,.75fr); gap: 16px; margin-bottom: 16px; }
.project-overview-workspace > .panel { margin: 0; }
.project-overview-workspace .section-heading > span { color: var(--muted); font-size: 10px; }
.overview-step-list { display: grid; gap: 7px; }
.overview-step-list article { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 10px 11px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.overview-step-list article > div { min-width: 0; }
.overview-step-list article strong { display: inline; margin-left: 7px; font-size: 13px; }
.overview-step-list article small { display: block; margin-top: 5px; color: var(--muted); font-size: 10px; }
.overview-step-status { display: inline-block; padding: 3px 6px; border-radius: 5px; background: #eef3f5; color: #58666b; font-size: 9px; font-weight: 700; }
.overview-step-list .step-log-link { flex: 0 0 auto; }
.overview-add-task { margin-top: 10px; }
.overview-empty-task { padding: 22px 12px; border: 1px dashed var(--line); border-radius: 8px; text-align: center; }
.overview-empty-task p { margin: 5px 0 0; color: var(--muted); font-size: 11px; }
.project-quick-memo textarea { width: 100%; min-height: 148px; resize: vertical; }
.project-quick-memo-actions { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 10px; }
.project-quick-memo-actions small { max-width: 290px; color: var(--muted); font-size: 10px; line-height: 1.5; }
.project-basic-info { margin-bottom: 16px; }
@media (max-width: 900px) {
  .project-command-kpis { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .project-command-progress { grid-column: 1 / -1; }
  .project-overview-workspace { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .project-command-panel { padding: 10px; }
  .project-command-panel .section-heading { align-items: center; }
  .project-command-panel .section-heading .button { padding: 6px 8px; font-size: 10px; }
  .project-command-kpis { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .project-command-kpis > div { padding: 7px 9px; }
  .project-command-kpis strong { font-size: 13px; }
  .project-command-kpis > div:nth-child(3),.project-command-progress { grid-column: auto; }
  .overview-step-list article { align-items: flex-start; }
  .overview-step-list article strong { display: block; margin: 5px 0 0; }
  .overview-step-list .step-log-link { align-self: center; width: auto; min-width: 92px; max-width: none; padding-inline: 10px; white-space: normal; text-align: center; line-height: 1.25; }
  .project-quick-memo textarea { min-height: 120px; }
  .project-quick-memo-actions { align-items: stretch; flex-direction: column; }
  .project-quick-memo-actions .button { width: 100%; }
}
.path-text { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; word-break: break-all; }

.secret-card, .work-log, .list-item, .activity, .user-row {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px;
  margin-bottom: 12px;
}
.secret-card div, .work-log header, .work-log footer {
  display: flex;
  justify-content: space-between;
  gap: 12px;
}
.work-log footer { align-items: center; }
.work-log-actions {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}
.work-log-actions form { margin: 0; }
.work-log-edit {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}
.work-log-edit[hidden] { display: none !important; }
.secret-card span, .work-log span, .activity span, .list-item span { color: var(--muted); font-size: 13px; }
.user-row { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.user-row span { display: block; color: var(--muted); font-size: 13px; margin-top: 3px; }
.settings-panel { margin-top: 18px; }
.secret-card code {
  display: block;
  padding: 8px;
  background: #f0f3f6;
  border-radius: 6px;
  word-break: break-all;
}
.work-log-content { display: -webkit-box; margin: 14px 0; overflow: hidden; color: var(--text); font-size: 13px; line-height: 1.6; overflow-wrap: anywhere; -webkit-box-orient: vertical; -webkit-line-clamp: 6; }
.work-log-content.is-expanded { display: block; overflow: visible; -webkit-line-clamp: unset; }
.work-log-content-toggle { margin: -5px 0 11px; padding: 0; border: 0; background: transparent; color: var(--primary); font-size: 11px; font-weight: 700; cursor: pointer; }
.work-log-content-toggle:hover { text-decoration: underline; }
.bill-toggle.is-disabled { border-color: #ddd8d2; background: #f3f1ee; color: #9a948e; cursor: not-allowed; opacity: .75; }
.work-log-layout { display: grid; grid-template-columns: minmax(360px,.85fr) minmax(480px,1.15fr); gap: 18px; align-items: start; }
.work-log-add-form { position: sticky; top: 18px; }
.work-log-add-form > h2 { grid-column: 1 / -1; margin-bottom: 2px; }
.work-log-details { border-top: 1px solid var(--line); }
.work-log-details > summary { width: max-content; padding: 9px 0 3px; color: var(--muted); font-size: 11px; font-weight: 700; cursor: pointer; }
.work-log-detail-grid { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 10px; align-items: end; padding-top: 8px; }
.work-log-detail-grid .field { margin: 0; }
.work-log-filter { display: grid; grid-template-columns: minmax(140px,1fr) 120px 140px 140px auto; gap: 7px; margin-bottom: 14px; }
.work-log-filter input,.work-log-filter select { width: 100%; min-width: 0; min-height: 34px; }
.work-log header > div { display: grid; gap: 5px; min-width: 0; }
.work-log-task { display: inline-flex; width: max-content; max-width: 100%; padding: 3px 7px; border-radius: 5px; background: color-mix(in srgb,var(--production) 12%,#fff); color: var(--production) !important; font-size: 10px !important; font-weight: 800; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.work-log-task.is-project { background: #f1f3f3; color: var(--muted) !important; }
.bill-toggle {
  border: 1px solid #f2c6a5;
  color: #99520c;
  background: #fff7ed;
  border-radius: 999px;
  padding: 5px 10px;
  cursor: pointer;
}
.bill-toggle.is-on { border-color: #9dd7bd; color: var(--ok); background: #effaf4; }

.flash {
  padding: 12px 14px;
  border-radius: 8px;
  background: #effaf4;
  color: var(--ok);
  margin-bottom: 16px;
}
.flash.danger { background: #fff1f0; color: var(--danger); }
.empty { color: var(--muted); margin: 12px 0; }

.confirm-modal {
  position: fixed;
  inset: 0;
  z-index: 20;
  display: grid;
  place-items: center;
  background: rgba(23,35,51,.46);
  padding: 18px;
}
.confirm-modal[hidden] { display: none; }
.confirm-dialog {
  width: min(420px, 100%);
  background: #fff;
  border-radius: 8px;
  border: 1px solid var(--line);
  box-shadow: 0 24px 70px rgba(23,35,51,.22);
  padding: 22px;
}
.confirm-dialog h2 { margin: 0 0 8px; font-size: 20px; }
.confirm-dialog p { margin: 0 0 18px; color: var(--muted); line-height: 1.6; }
.confirm-actions { display: flex; justify-content: flex-end; gap: 8px; }

@media (max-width: 900px) {
  .sidebar { position: static; width: auto; }
  .sidebar nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .main { margin-left: 0; padding: 18px; }
  .page-header, .split { display: block; }
  .page-header .button, .button-row { margin-top: 12px; }
  .stats-grid, .project-summary, .form-grid, .detail-grid { grid-template-columns: 1fr; }
  .project-summary div { border-right: 0; border-bottom: 1px solid var(--line); }
  .project-summary div:last-child { border-bottom: 0; }
  .split > * + * { margin-top: 16px; }
  .dashboard-project-item {
    grid-template-columns: 1fr;
    gap: 6px;
  }
  .dashboard-project-item em { text-align: left; }
  .dashboard-project-item .category-badge { width: max-content; }
}

/* Web department OS */
:root {
  --bg: #f7f8f8;
  --text: #20272b;
  --muted: #6d767a;
  --line: #e2e5e4;
  --primary: #ed643e;
  --primary-dark: #c84c2a;
  --sidebar: #514740;
  --production: #5846b6;
  --maintenance: #2e9d64;
  --spot: #ed643e;
}
body { min-width: 320px; }
.sidebar {
  width: 244px;
  overflow-y: auto;
  background: var(--sidebar);
  color: #2d3335;
  padding: 22px 14px;
  border-right: 1px solid #c5c3c1;
}
.brand { margin: 0 8px 26px; }
.brand-mark { background: #ed643e; color: #fff; box-shadow: 0 4px 12px rgba(237,100,62,.22); }
.brand small { color: #62696b; }
.sidebar a { color: #454b4d; font-weight: 600; padding: 10px 13px; }
.sidebar a.is-active, .sidebar a:hover { background: rgba(255,255,255,.72); color: #276f80; }
.sidebar .nav-section { border-color: rgba(56,60,61,.12); margin: 9px 0; }
.nav-data-details { border-top: 1px solid rgba(56,60,61,.12); padding-top: 7px; }
.nav-data-details summary { position: relative; padding: 10px 32px 10px 13px; border-radius: 8px; color: #454b4d; font-weight: 600; cursor: pointer; list-style: none; }
.nav-data-details summary::-webkit-details-marker { display: none; }
.nav-data-details summary::after { content: '›'; position: absolute; right: 14px; transform: rotate(0); transition: transform .15s ease; }
.nav-data-details[open] summary::after { transform: rotate(90deg); }
.nav-data-details summary:hover,.nav-data-details summary.is-active { background: rgba(255,255,255,.72); color: #276f80; }
.nav-data-details > div { display: grid; gap: 3px; padding: 4px 0 1px 13px; }
.nav-data-details > div a { padding-block: 8px; font-size: 13px; }
.category-nav.production span { background: var(--production); }
.category-nav.maintenance span { background: var(--maintenance); }
.category-nav.spot span { background: var(--spot); }
.nav-logout { margin-top: 14px; color: #795454 !important; }
.mobile-nav-toggle { display: none; }
.main a[href],.main button,.main summary,.sidebar a,.sidebar summary,input,select,textarea { transition: color .15s ease,background-color .15s ease,border-color .15s ease,box-shadow .15s ease,transform .15s ease; }
.main a[href]:hover { color: var(--primary-dark); }
.button:not(:disabled):hover { transform: translateY(-1px); border-color: #b5c8cc; box-shadow: 0 4px 10px rgba(37,54,58,.09); }
.main .button.primary:hover { color: #fff; background: var(--primary-dark); }
.button:not(:disabled):active { transform: translateY(0); box-shadow: none; }
.button.danger:hover { border-color: #dc8f88; background: #fff7f6; color: #98251b; }
.text-danger:hover { color: #8f1c14; text-decoration: underline; text-underline-offset: 2px; }
input:hover,select:hover,textarea:hover { border-color: #b8c6c9; }
.main summary:hover { background-color: #f7faf9; }
.main table a[href]:hover,.breadcrumbs a[href]:hover,.strong-link:hover { text-decoration: underline; text-underline-offset: 3px; }
.brand-stack a:hover,.related-list a:hover,.brand-record-card:hover,.settings-link:hover { transform: translateY(-1px); border-color: #b8d1d6; background: #f9fbfb; box-shadow: 0 4px 10px rgba(37,54,58,.06); }
.tabs a:hover { background: #f1f6f6; color: var(--primary-dark); }
.main a[href]:focus-visible,.main button:focus-visible,.main summary:focus-visible,.sidebar a:focus-visible,.sidebar summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible { outline: 2px solid color-mix(in srgb,var(--primary) 68%,#fff); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) {
  .main a[href],.main button,.main summary,.sidebar a,.sidebar summary,input,select,textarea { transition: none; }
}
.main { margin-left: 244px; padding: 30px clamp(20px,3vw,44px); max-width: 1800px; }
.page-header { align-items: center; margin-bottom: 24px; }
.page-header h1 { font-size: 28px; }
.page-header p { font-size: 14px; }
.panel, .stat, .project-summary, .record-summary, .kpi-card, .entity-card, .maintenance-stats > div, .settings-link {
  border-color: var(--line);
  box-shadow: 0 3px 12px rgba(37,54,58,.045);
}
.panel { padding: 20px; }
.kpi-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 14px; margin-bottom: 16px; }
.kpi-card { min-width: 0; background: #fff; border: 1px solid var(--line); border-radius: 8px; padding: 18px; color: var(--text); }
.kpi-card:hover,
.entity-card:hover,
.brand-record-card:hover,
.settings-link:hover { border-color: var(--primary); }
.kpi-card span, .kpi-card small { display: block; color: var(--muted); }
.kpi-card > div { display: flex; align-items: baseline; gap: 8px; margin: 8px 0 12px; }
.kpi-card strong { display: block; font-size: 32px; color: #26383e; }
.kpi-card > div b { font-size: 13px; font-weight: 600; }
.kpi-card small { display: flex; align-items: center; gap: 6px; color: var(--primary); font-weight: 700; }
.kpi-card small i, .section-heading a i { font-style: normal; font-size: 18px; line-height: 1; }
.type-summary { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; margin-bottom: 20px; }
.type-summary a { background: #fff; border: 1px solid var(--line); border-radius: 8px; padding: 15px 18px; color: var(--text); display: flex; align-items: baseline; gap: 9px; }
.type-summary a:hover { border-color: var(--primary); }
.type-title-badge {
  display: inline-flex;
  align-items: center;
  width: max-content;
  min-height: 26px;
  padding: 3px 10px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb,var(--type-color) 55%,#fff);
  background: color-mix(in srgb,var(--type-color) 14%,#fff);
  color: var(--type-color);
  font-size: 12px;
  font-weight: 800;
}
.type-title-badge.is-solid {
  border-color: var(--type-color);
  background: var(--type-color);
  color: #fff;
}
.type-summary strong { margin-left: auto; font-size: 25px; }
.type-summary em { margin-left: 10px; padding: 4px 9px; border: 1px solid var(--line); border-radius: 6px; color: var(--muted); font-size: 11px; font-style: normal; }
.dashboard-grid { display: grid; grid-template-columns: minmax(0,1.55fr) minmax(300px,.85fr); gap: 18px; align-items: start; }
.schedule-panel { grid-row: auto; }
.section-heading { display: flex; justify-content: space-between; align-items: center; margin-bottom: 14px; }
.section-heading h2 { margin: 0; }
.section-heading a { font-size: 13px; font-weight: 700; }
.dashboard-deadlines, .dashboard-updates { min-height: 355px; }
.dashboard-project-summaries,.recent-update-list { display: grid; }
.dashboard-project-summaries > a,.recent-update-list > a { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 12px; align-items: center; padding: 12px 2px; border-bottom: 1px solid #edf0ef; color: var(--text); }
.dashboard-project-summaries > a:last-child,
.recent-update-list > a:last-child { border-bottom: 0; }
.dashboard-project-summary { min-width: 0; }
.dashboard-project-summary strong,.dashboard-project-summary small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dashboard-project-summary strong { color: var(--text); font-size: 13px; }
.dashboard-project-summary small { margin-top: 4px; color: var(--muted); font-size: 11px; }
.dashboard-project-summaries .type-badge,.recent-update-list .type-badge { white-space: nowrap; }
.summary-badges,.compact-badges { display: inline-flex; align-items: center; justify-content: flex-end; gap: 6px; flex-wrap: wrap; }
.schedule-legend { display: flex; gap: 16px; margin: -5px 0 10px; color: var(--muted); font-size: 11px; }
.schedule-legend span::before { content: ""; display: inline-block; width: 8px; height: 8px; margin-right: 6px; border-radius: 2px; }
.schedule-legend .production::before { background: var(--production); }
.schedule-legend .maintenance::before { background: var(--maintenance); }
.schedule-legend .spot::before { background: var(--spot); }
.compact-list { display: grid; gap: 2px; }
.compact-list > a { display: grid; grid-template-columns: 10px minmax(0,1fr) auto; gap: 10px; align-items: center; color: var(--text); padding: 10px 6px; border-bottom: 1px solid #eef0ef; }
.compact-list > a:last-child { border-bottom: 0; }
.compact-list strong, .compact-list small { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.compact-list small { margin-top: 3px; }
.compact-list time { color: var(--muted); font-size: 12px; }
.type-dot { width: 8px; height: 8px; border-radius: 2px; background: var(--type-color); }
.type-badge { font-size: 11px; font-weight: 700; padding: 4px 8px; border-radius: 6px; background: color-mix(in srgb,var(--type-color) 14%,#fff); color: var(--type-color); }
.type-badge.is-solid { background: var(--type-color); color: #fff !important; }
.project-status-badge,.spot-status-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: max-content;
  padding: 4px 8px;
  border-radius: 6px;
  background: #f2f4f4;
  color: #52605f;
  font-size: 11px;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
}
.current-step-badge { display: inline-flex; width: max-content; max-width: 160px; overflow: hidden; padding: 4px 8px; border: 1px solid #d9dfe1; border-radius: 6px; background: #f7f9f9; color: #586467; font-size: 10px; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; vertical-align: middle; }
.task-more-badge { flex: 0 0 auto; background: #edf3f8; color: #466070; }
.current-step-list { min-width: 180px; }
.current-step-list .current-step-badge { margin: 2px 4px 2px 0; }
.project-status-未対応,
.project-status-未着手,
.project-status-相談中 {
  background: #f1eeea;
  color: #514740 !important;
}
.project-status-作業中,
.project-status-進行中,
.project-status-制作中 {
  background: color-mix(in srgb,var(--accent-blue) 14%,#fff);
  color: var(--accent-blue) !important;
}
.project-status-要確認,
.project-status-確認中 {
  background: #fff0e8;
  color: var(--primary-dark) !important;
}
.project-status-対応完了,
.project-status-完了,
.project-status-公開済み {
  background: color-mix(in srgb,var(--maintenance) 14%,#fff);
  color: var(--maintenance) !important;
}
.project-status-badge[style*="--status-color"] {
  background: color-mix(in srgb,var(--status-color) 14%,#fff);
  color: var(--status-text-color, var(--status-color)) !important;
}
.project-status-badge.is-solid {
  background: var(--status-color) !important;
  color: #fff !important;
}
.spot-status-badge {
  background: color-mix(in srgb,var(--spot) 16%,#fff);
  color: var(--spot);
}
.customer-summary-panel .section-heading h2 small { color: var(--muted); font-size: 11px; font-weight: 500; }
.customer-summary-panel .section-heading { align-items: flex-start; gap: 6px; }
.customer-summary-panel .section-heading h2 { font-size: 16px; }
.customer-summary-panel .section-heading h2 small { font-size: 9px; }
.customer-summary-panel .section-heading > a { flex: 0 0 auto; white-space: nowrap; font-size: 10px; }
.mini-company-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; }
.customer-summary-card { display: flex; flex-direction: column; min-width: 0; padding: 11px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.customer-summary-card header { display: flex; align-items: center; gap: 8px; min-width: 0; }
.customer-summary-card header > div { min-width: 0; }
.customer-summary-card header strong, .customer-summary-card header small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.customer-summary-card header strong { font-size: 11px; }
.customer-summary-card header small { margin-top: 2px; font-size: 9px; color: var(--muted); }
.customer-initial { display: grid; place-items: center; width: 32px; height: 32px; flex: 0 0 32px; border-radius: 50%; background: #47788b; color: #fff; font-size: 11px; font-weight: 800; }
.customer-summary-card p { display: flex; justify-content: space-between; margin: 12px 0 8px; padding-bottom: 7px; border-bottom: 1px solid var(--line); color: var(--muted); font-size: 10px; }
.customer-summary-card p b { color: var(--text); }
.customer-project-counts { display: grid; grid-template-columns: repeat(3,1fr); gap: 3px; }
.customer-project-counts span { display: grid; place-items: center; gap: 3px; min-width: 0; padding: 5px 2px; border-radius: 4px; font-size: 8px; }
.customer-project-counts .production { background: color-mix(in srgb,var(--production) 14%,#fff); color: var(--production); }
.customer-project-counts .maintenance { background: color-mix(in srgb,var(--maintenance) 14%,#fff); color: var(--maintenance); }
.customer-project-counts .spot { background: color-mix(in srgb,var(--spot) 14%,#fff); color: var(--spot); }
.customer-detail-button { display: grid; place-items: center; min-height: 31px; margin-top: 9px; border: 1px solid var(--line); border-radius: 6px; color: var(--text); font-size: 10px; font-weight: 700; }
.maintenance-report-import { margin-bottom: 18px; }
.maintenance-report-import .section-heading { margin-bottom: 12px; }
.maintenance-report-import .section-heading p { margin: 5px 0 0; color: var(--muted); font-size: 13px; }
.maintenance-report-upload { display: flex; align-items: center; gap: 10px; padding: 14px; border: 1px dashed #b9c8c9; border-radius: 8px; background: #f8fbfb; }
.maintenance-report-upload input { flex: 1; min-width: 0; }
.privacy-note { margin: 9px 0 0; color: var(--muted); font-size: 11px; }
.report-preview-error { margin-top: 14px; padding: 11px 13px; border-radius: 7px; background: #fff1f0; color: var(--danger); }
.maintenance-report-preview { margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--line); }
.report-preview-heading { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 12px; }
.report-preview-heading span,.report-preview-heading strong { display: block; }
.report-preview-heading span { color: var(--muted); font-size: 11px; }
.report-preview-heading strong { margin-top: 3px; overflow-wrap: anywhere; }
.report-preview-heading > b { padding: 5px 8px; border-radius: 6px; background: #fff0e8; color: #ad5124; font-size: 10px; white-space: nowrap; }
.report-common-fields,.report-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1px; margin: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: var(--line); }
.report-common-fields { grid-template-columns: repeat(3,minmax(0,1fr)); margin-bottom: 14px; }
.report-common-fields > div,.report-fields > div { min-width: 0; padding: 12px 14px; background: #fff; }
.report-common-fields dt,.report-fields dt { margin-bottom: 5px; color: var(--muted); font-size: 11px; }
.report-common-fields dd,.report-fields dd { margin: 0; overflow-wrap: anywhere; font-size: 13px; line-height: 1.65; }
.report-site-stack { display: grid; gap: 14px; }
.report-site-preview { padding: 15px; border: 1px solid var(--line); border-radius: 8px; background: #fafcfc; }
.report-site-preview > header { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 11px; }
.report-site-preview > header span { color: var(--muted); font-size: 10px; }
.report-site-preview h3 { margin: 3px 0 0; font-size: 16px; }
.report-site-preview > header a { flex: 0 0 auto; font-size: 12px; font-weight: 700; }
.report-fields .wide { grid-column: 1/-1; }
.report-plugin-list { display: grid; gap: 8px; margin: 0; padding-left: 22px; }
.report-plugin-list li { padding-left: 3px; }
.report-plugin-list strong,.report-plugin-list span { display: block; }
.report-plugin-list span { color: var(--muted); font-size: 11px; }
.report-email-preview { margin-top: 14px; padding: 15px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.report-email-preview h3 { margin: 0 0 10px; font-size: 15px; }
.report-email-preview > div { max-height: 420px; overflow: auto; padding: 13px; border-radius: 6px; background: #f7f8f8; font-size: 12px; line-height: 1.7; white-space: normal; }
.report-import-action { display: flex; align-items: center; gap: 12px; margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--line); }
.report-import-action small { color: var(--muted); }
.maintenance-import-form { display: grid; gap: 18px; }
.maintenance-import-common,.maintenance-import-texts { margin: 0; }
.maintenance-import-sites { display: grid; gap: 18px; }
.maintenance-import-site .section-heading > div > span { color: var(--muted); font-size: 10px; }
.maintenance-import-site .section-heading h2 { margin-top: 3px; }
.match-ok { padding: 5px 8px; border-radius: 6px; font-size: 10px; white-space: nowrap; }
.match-ok { background: #e7f6f1; color: #18735b; }
.maintenance-import-form textarea.tall { min-height: 180px; }
.maintenance-import-form textarea.extra-tall { min-height: 300px; }
.report-form-section { margin: 16px 0 0; padding: 15px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.report-form-section legend { padding: 0 8px; color: var(--text); font-weight: 800; }
.report-form-section .field { margin-bottom: 0; }
.maintenance-plugin-rows { display: grid; gap: 8px; margin-bottom: 10px; }
.maintenance-plugin-row { display: grid; grid-template-columns: minmax(260px,2fr) minmax(180px,1fr) auto; gap: 9px; align-items: end; padding: 10px; border: 1px solid var(--line); border-radius: 7px; background: #fff; }
.maintenance-plugin-row .field { margin: 0; }
.maintenance-plugin-row textarea { min-height: 56px; resize: vertical; }
.maintenance-plugin-row textarea[data-plugin-number-list] { height: 300px; min-height: 300px; }
.maintenance-report-summary { display: grid; gap: 0; margin: 12px 0 0; border-top: 1px solid var(--line); }
.maintenance-report-summary > div { display: grid; grid-template-columns: 110px minmax(0,1fr); gap: 8px; padding: 7px 1px; border-bottom: 1px solid #edf0ef; font-size: 11px; }
.maintenance-report-summary dt { color: var(--muted); }
.maintenance-report-summary dd { margin: 0; overflow-wrap: anywhere; font-weight: 700; }
.report-summary-card { display: flex; flex-direction: column; }
.report-summary-card .customer-detail-button { margin-top: auto; }
.maintenance-report-meta { margin-bottom: 18px; }
.maintenance-report-meta textarea.extra-tall { min-height: 300px; }
.maintenance-month-filter { display: flex; gap: 8px; align-items: center; margin-bottom: 16px; }
.maintenance-month-filter input { width: auto; }
.maintenance-log-add { display: grid; grid-template-columns: minmax(220px,1fr) minmax(260px,1.2fr) auto; gap: 12px; align-items: center; margin-bottom: 18px; }
.maintenance-log-add h2,.maintenance-log-add p { margin: 0; }
.maintenance-log-add p { margin-top: 4px; color: var(--muted); font-size: 12px; }
.maintenance-report-edit-stack { display: grid; gap: 18px; }
.maintenance-report-editor > .button.primary { margin-top: 16px; }
.maintenance-import-actions { position: sticky; bottom: 12px; z-index: 4; display: flex; justify-content: flex-end; gap: 8px; padding: 12px; border: 1px solid var(--line); border-radius: 8px; background: rgba(255,255,255,.94); box-shadow: 0 8px 24px rgba(37,54,58,.12); backdrop-filter: blur(8px); }
.report-import-errors { margin-bottom: 18px; padding: 14px 16px; border: 1px solid #f1b7b2; border-radius: 8px; background: #fff1f0; color: var(--danger); }
.report-import-errors ul { margin: 7px 0 0; padding-left: 20px; }
.imported-maintenance-log .section-heading > b { color: var(--maintenance); font-size: 12px; }
.imported-report-texts { margin-top: 18px; }
.imported-report-texts > div { padding: 13px; border-radius: 6px; background: #f7f8f8; font-size: 12px; line-height: 1.7; }
.imported-report-texts details { margin-top: 14px; border-top: 1px solid var(--line); padding-top: 14px; }
.imported-report-texts summary { cursor: pointer; font-weight: 700; }
.imported-report-texts pre { max-height: 520px; overflow: auto; padding: 14px; border-radius: 6px; background: #f7f8f8; white-space: pre-wrap; overflow-wrap: anywhere; font: inherit; font-size: 12px; line-height: 1.65; }
.imported-report-list { margin-bottom: 24px; }
.imported-report-list > a,.imported-history-item { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 11px 2px; border-bottom: 1px solid #edf0ef; color: var(--text); }
.imported-report-list > a:last-child,.imported-history-item:last-child { border-bottom: 0; }
.imported-report-list strong,.imported-report-list small,.imported-history-item strong,.imported-history-item span { display: block; }
.imported-report-list small,.imported-history-item span { margin-top: 3px; color: var(--muted); font-size: 11px; }
.imported-report-list > a > span,.imported-history-item > b { flex: 0 0 auto; color: var(--primary); font-size: 12px; }
.filter-bar { background: #fff; border: 1px solid var(--line); border-radius: 8px; padding: 12px; }
.entity-card-grid { display: grid; grid-template-columns: repeat(3,minmax(260px,1fr)); gap: 16px; }
.entity-card { display: flex; flex-direction: column; min-height: 210px; padding: 18px; background: #fff; border: 1px solid var(--line); border-radius: 8px; color: var(--text); transition: transform .15s ease,box-shadow .15s ease; }
.entity-card:hover { transform: translateY(-2px); box-shadow: 0 8px 22px rgba(37,54,58,.1); }
.entity-card header { display: flex; align-items: flex-start; gap: 12px; }
.entity-card header > div:not(.entity-avatar) { min-width: 0; flex: 1; }
.entity-card h2 { margin: 0 0 5px; font-size: 17px; overflow-wrap: anywhere; }
.entity-card header span { color: var(--muted); font-size: 12px; }
.entity-avatar { display: grid; place-items: center; width: 40px; height: 40px; flex: 0 0 40px; border-radius: 8px; background: #e4f0f2; color: var(--primary); font-weight: 800; }
.status-chip { display: inline-flex; width: max-content; white-space: nowrap; padding: 4px 8px; border-radius: 6px; background: #edf3f2; color: #47625e !important; font-size: 11px !important; font-weight: 700; }
.entity-card-body { margin: 15px 0; color: var(--muted); font-size: 13px; }
.entity-card-body p { margin: 5px 0; overflow-wrap: anywhere; }
.entity-card footer { display: flex; justify-content: space-between; gap: 10px; margin-top: auto; padding-top: 12px; border-top: 1px solid #edf0ef; color: var(--muted); font-size: 12px; }
.entity-card footer b { color: var(--primary); }
.card-counts { display: grid; grid-template-columns: repeat(2,1fr); gap: 8px; margin: 18px 0; }
.card-counts span { padding: 7px 8px; border-radius: 6px; background: #f4f6f5; color: var(--muted); font-size: 12px; }
.card-counts .production { background: color-mix(in srgb,var(--production) 14%,#fff); color: var(--production); }
.card-counts .maintenance { background: color-mix(in srgb,var(--maintenance) 14%,#fff); color: var(--maintenance); }
.card-counts .spot { background: color-mix(in srgb,var(--spot) 14%,#fff); color: var(--spot); }
.breadcrumbs { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; margin: -10px 0 16px; color: var(--muted); font-size: 12px; }
.record-summary { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); margin-bottom: 16px; background: #fff; border: 1px solid var(--line); border-radius: 8px; }
.record-summary div { padding: 15px 17px; border-right: 1px solid var(--line); min-width: 0; }
.record-summary div:last-child { border-right: 0; }
.record-summary span { display: block; color: var(--muted); font-size: 11px; margin-bottom: 5px; }
.record-summary strong { display: block; overflow-wrap: anywhere; }
.detail-dashboard { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; align-items: start; }
.metric-row { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.metric-row span { padding: 8px 10px; background: #f4f6f5; border-radius: 6px; color: var(--muted); font-size: 12px; }
.metric-row b { margin-left: 5px; color: var(--text); }
.brand-stack,.related-list { display: grid; gap: 8px; }
.brand-stack a,.related-list a { display: flex; justify-content: space-between; gap: 12px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 7px; color: var(--text); }
.brand-stack span,.related-list span { color: var(--muted); font-size: 12px; }
.domain-tree { display: grid; gap: 12px; margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--line); }
.domain-tree > div { display: grid; gap: 5px; }
.tree-child { margin-left: 18px; color: var(--muted); font-size: 13px; }
.typed-projects { padding: 4px 18px; }
.typed-projects td small { display: block; margin-top: 4px; }
.typed-projects .status-badges,.typed-projects .pill { white-space: nowrap; }
.typed-projects th:last-child,.typed-projects td:last-child { min-width: 72px; }
.timeline-section { margin-top: 18px; overflow: hidden; }
.timeline { min-width: 600px; }
.timeline { position: relative; --timeline-label-width: 250px; --timeline-months: 3; --timeline-grid-lines: 9; }
.timeline-head,.timeline-row,.timeline-today-footer { display: grid; grid-template-columns: var(--timeline-label-width) repeat(var(--timeline-months),1fr); }
.timeline-column-resizer { position: absolute; z-index: 7; top: 0; bottom: 0; left: calc(var(--timeline-label-width) - 5px); width: 10px; padding: 0; border: 0; background: transparent; cursor: col-resize; touch-action: none; }
.timeline-column-resizer::before { content: ""; position: absolute; top: 0; bottom: 0; left: 4px; width: 2px; border-radius: 2px; background: transparent; transition: background-color .15s ease,box-shadow .15s ease; }
.timeline-column-resizer:hover::before,.timeline-column-resizer.is-dragging::before { background: var(--primary); box-shadow: 0 0 0 2px color-mix(in srgb,var(--primary) 14%,transparent); }
.timeline-column-resizer.is-dragging { cursor: col-resize; }
.timeline-head b { padding: 6px 0 0; text-align: center; color: var(--muted); font-size: 11px; border-left: 1px solid var(--line); }
.timeline-head b > strong { display: block; color: var(--text); }
.timeline-head b > small { display: flex; justify-content: space-around; margin-top: 6px; padding: 4px 0; border-top: 1px solid var(--line); font-size: 9px; font-weight: 500; }
.timeline-row > span,.timeline-row > a { padding: 8px 10px; color: var(--text); font-size: 12px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.timeline-row > a:hover strong { color: var(--primary); }
.timeline-project-group { margin: 8px 0 14px; overflow: hidden; border: 1px solid #d9e6f5; border-radius: 8px; background: #fff; }
.timeline-project-group > summary { list-style: none; cursor: pointer; }
.timeline-project-group > summary::-webkit-details-marker { display: none; }
.timeline-project-row > a { display: flex; align-items: center; gap: 7px; padding: 11px 10px 11px 12px; border-left: 4px solid var(--project-color,var(--production)); background: color-mix(in srgb,var(--project-color,var(--production)) 8%,#fff); font-size: 13px; font-weight: 800; }
.timeline-project-row > a strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.timeline-project-row > a .timeline-status-badge { flex: 0 0 auto; margin-left: auto; }
.timeline-disclosure { flex: 0 0 auto; color: var(--project-color,var(--production)); font-size: 18px; line-height: 1; transition: transform .16s ease; }
.timeline-project-group[open] .timeline-disclosure { transform: rotate(90deg); }
.timeline-disclosure.is-leaf { font-size: 12px; transform: none; }
.timeline-project-group .timeline-project-row > div { min-height: 43px; border-bottom: 1px solid color-mix(in srgb,var(--project-color,var(--production)) 18%,#fff); background-color: color-mix(in srgb,var(--project-color,var(--production)) 8%,#fff); }
.timeline-project-row .timeline-bar.timeline-project-bar { top: 14px; height: 14px; border-radius: 7px; box-shadow: 0 1px 2px rgba(18,86,173,.2); }
.timeline-project-status-slot { position: absolute; z-index: 4; top: 9px; right: 8px; }
.timeline-status-badge { display: inline-flex; width: max-content; padding: 3px 7px; border-radius: 999px; font-size: 9px; font-weight: 800; white-space: nowrap; }
.timeline-step-row > .timeline-step-label { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 6px; padding: 8px 10px 8px 38px; color: #5e6a6d; font-size: 11px; font-weight: 500; }
.timeline-step-label > span:first-child { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.timeline-task-meta { display: inline-flex; flex: 0 0 auto; align-items: center; gap: 5px; min-width: 0; }
.timeline-task-assignee { max-width: 82px; overflow: hidden; color: var(--muted); font-size: 9px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.timeline-task-status-badge { flex: 0 0 auto; padding: 2px 6px; font-size: 8px; }
.timeline-step-row > .timeline-step-label::before { content: ''; position: absolute; left: 20px; top: 0; width: 10px; height: 50%; border-left: 1px solid #cbd7df; border-bottom: 1px solid #cbd7df; }
.timeline-step-row:not(:last-child) > .timeline-step-label::after { content: ''; position: absolute; left: 20px; top: 50%; bottom: 0; border-left: 1px solid #cbd7df; }
.timeline-project-group .timeline-step-row > div { min-height: 32px; background-color: #fff; border-bottom-color: #edf1f4; }
.timeline-project-group .timeline-step-row:last-child > div { border-bottom: 0; }
.timeline-project-group .timeline-step-row .timeline-bar { top: 12px; height: 8px; border-radius: 4px; background: color-mix(in srgb,var(--bar-color) 48%,#fff); }
.timeline-compact-groups .timeline-project-group { margin: 6px 0 10px; }
.timeline-compact-groups .timeline-project-row > a { padding-block: 9px; font-size: 12px; }
.timeline-compact-groups .timeline-project-group .timeline-project-row > div { min-height: 38px; }
.timeline-compact-groups .timeline-project-row .timeline-bar.timeline-project-bar { top: 12px; height: 13px; }
.timeline-compact-groups .timeline-project-status-slot { top: 7px; }
.timeline-compact-groups .timeline-step-row > .timeline-step-label { padding-block: 7px; font-size: 10px; }
.timeline-compact-groups .timeline-project-group .timeline-step-row > div { min-height: 30px; }
.timeline-compact-groups .timeline-project-group .timeline-step-row .timeline-bar { top: 11px; }
.timeline-row > .timeline-project-summary { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 8px; align-items: center; white-space: normal; }
.timeline-project-summary .dashboard-project-summary strong { font-size: 12px; }
.timeline-project-summary .dashboard-project-summary small { font-size: 10px; }
.timeline-project-summary .type-badge { padding: 3px 6px; font-size: 9px; white-space: nowrap; }
.timeline-row > div { grid-column: 2/-1; position: relative; min-height: 34px; background: repeating-linear-gradient(90deg,#fff 0,#fff calc(100% / var(--timeline-grid-lines) - 1px),#edf0ef calc(100% / var(--timeline-grid-lines) - 1px),#edf0ef calc(100% / var(--timeline-grid-lines))); border-bottom: 1px solid #f0f1f1; }
.timeline-row .timeline-bar { position: absolute; z-index: 2; top: 11px; height: 11px; border-radius: 5px; background: var(--bar-color); }
.timeline-row .timeline-bar[data-timeline-range] { cursor: default; outline: none; }
.timeline-row .timeline-bar[data-timeline-range]:focus-visible { box-shadow: 0 0 0 3px color-mix(in srgb,var(--bar-color) 28%,#fff); }
.timeline-range-tooltip { position: fixed; z-index: 1000; max-width: min(280px,calc(100vw - 24px)); padding: 7px 10px; border-radius: 7px; background: #3f3833; color: #fff; box-shadow: 0 5px 16px rgba(38,31,27,.22); font-size: 11px; font-weight: 700; line-height: 1.4; white-space: nowrap; pointer-events: none; }
.timeline-range-tooltip[hidden] { display: none; }
@media (max-width: 900px) {
  .timeline-column-resizer { display: none; }
}
.timeline-today-line { position: absolute; z-index: 3; inset-block: 0; width: 1px; background: #e4555d; }
.timeline-today-footer > div { grid-column: 2/-1; position: relative; height: 19px; }
.timeline-today-footer b { position: absolute; top: 2px; transform: translateX(-50%); color: #e4555d; font-size: 9px; white-space: nowrap; }
.maintenance-stats { display: grid; grid-template-columns: repeat(6,1fr); gap: 12px; margin-bottom: 24px; }
.maintenance-stats > div { padding: 14px; background: #fff; border: 1px solid var(--line); border-radius: 8px; }
.maintenance-stats span { display: block; color: var(--muted); font-size: 12px; }
.maintenance-stats strong { display: block; font-size: 25px; margin-top: 6px; }
.maintenance-group { margin-bottom: 24px; }
.maintenance-group > h2 { margin: 0 0 10px; font-size: 18px; color: #3d4b4e; }
.company-maintenance { background: #fff; border: 1px solid var(--line); border-radius: 8px; margin-bottom: 12px; }
.company-maintenance summary { display: flex; justify-content: space-between; align-items: center; gap: 15px; padding: 15px 18px; cursor: pointer; }
.company-maintenance summary span { display: block; color: var(--muted); font-size: 12px; margin-top: 4px; }
.company-maintenance summary > b { color: var(--maintenance); }
.maintenance-sites { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; padding: 0 14px 14px; }
.maintenance-site { border: 1px solid var(--line); border-radius: 8px; padding: 13px; }
.maintenance-site header { display: flex; justify-content: space-between; gap: 10px; }
.maintenance-site header span { display: block; color: var(--muted); font-size: 11px; margin-top: 3px; }
.checklist { display: grid; grid-template-columns: repeat(2,1fr); gap: 7px; margin-top: 12px; }
.checklist label { display: flex; align-items: center; gap: 7px; font-size: 12px; }
.checklist input[type=checkbox] { width: auto; min-height: auto; }
.checklist label:has(input:checked) span { text-decoration: line-through; color: var(--muted); }
.maintenance-actions { grid-column: 1/-1; display: grid; grid-template-columns: 1fr 130px auto; gap: 7px; margin-top: 8px; }
.maintenance-actions input,.maintenance-actions select { min-height: 34px; }
.calendar-day { display: grid; grid-template-columns: 110px 1fr; border-bottom: 1px solid var(--line); }
.calendar-day > time { padding: 14px 8px; font-weight: 700; }
.calendar-day .compact-list { border-left: 1px solid var(--line); padding-left: 12px; }
.settings-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 16px; }
.settings-link { display: grid; gap: 5px; background: #fff; border: 1px solid var(--line); border-radius: 8px; padding: 18px; color: var(--text); }
.settings-link span { color: var(--muted); font-size: 13px; }
.settings-fields { grid-column: 1/-1; }
.settings-fields .list-item {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 12px;
}
.settings-fields .list-item form { margin: 0; }
.staff-member-list { display: grid; gap: 10px; }
.staff-member-form { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px; align-items: end; padding: 10px; border: 1px solid var(--line); border-radius: 8px; overflow: hidden; }
.staff-member-form.is-inactive { opacity: .58; background: #f8fafb; }
.staff-member-form .field { margin: 0; }
.staff-member-form input { width: 100%; min-width: 0; }
.staff-member-actions { grid-column: 1/-1; display: flex; justify-content: flex-end; align-items: center; gap: 8px; min-width: 0; }
.staff-member-actions .compact-check { margin-right: auto; }
.staff-member-actions .button { flex: 0 0 auto; }
.step-list { display: grid; gap: 8px; }
.step-list form { display: grid; grid-template-columns: 28px minmax(260px,1fr) 120px 120px 120px 105px 260px; gap: 7px; align-items: center; padding: 7px; border: 1px solid var(--line); border-radius: 8px; }
.step-drag-handle { width: 28px; min-height: 34px; padding: 0; border: 1px solid var(--line); border-radius: 7px; background: #fff; color: #9aa4a7; cursor: grab; line-height: 1; letter-spacing: -3px; }
.step-drag-handle:hover { background: #edf5f5; color: var(--primary); }
.step-drag-handle:active { cursor: grabbing; }
.step-sort-item.is-dragging { opacity: .45; border-style: dashed; }
.step-list input,.step-list select { min-height: 34px; }
.step-list input[name="name"] { border-color: #3f4b57; background: #52606d; color: #fff; caret-color: #fff; }
.step-list input[name="name"]:focus { border-color: #28333d; outline-color: color-mix(in srgb,#52606d 32%,transparent); }
.step-card-actions { display: flex; align-items: center; justify-content: flex-end; gap: 6px; min-width: 0; }
.main .button.step-log-link { flex: 0 0 64px; width: 64px; min-width: 64px; min-height: 32px; padding: 4px 5px; border: 0; border-radius: 5px; background: #fbe1d7; color: #f05f38; font-size: 9px; font-weight: 800; line-height: 1.15; text-align: center; white-space: nowrap; box-shadow: none; }
.main .button.step-log-link:hover { border: 0; background: #f8d4c5; color: #dc4e29; box-shadow: none; }
.main .overview-step-list .button.step-log-link { flex-basis: auto; width: auto; min-width: 96px; padding-inline: 12px; }
.step-log-label-mobile { display: none; }
.step-card-actions > button.button { flex: 0 0 58px; width: 58px; }
.step-schedule-check { display: inline-flex; align-items: center; gap: 4px; min-height: 26px; margin: 0; padding: 2px 0; border: 0; border-radius: 0; background: transparent; color: var(--muted); font-size: 9px; font-weight: 700; line-height: 1.1; white-space: nowrap; cursor: pointer; }
.step-schedule-check input { width: 13px; min-width: 13px; height: 13px; min-height: 13px; margin: 0; accent-color: var(--primary); }
.step-schedule-check:has(input:checked) { background: transparent; color: var(--primary-dark); }
.entity-form { max-width: 1040px; }
.entity-form > .field { align-self: start; }
.site-inline-create,.site-domain-input { min-width: 0; }
.site-inline-create > .field,.site-domain-input > .field { margin-bottom: 6px; }
.inline-entity-create { padding: 2px 0 8px; }
.inline-entity-create summary { width: max-content; padding: 4px 2px; color: var(--primary); font-size: 12px; font-weight: 700; cursor: pointer; list-style: none; }
.inline-entity-create summary::-webkit-details-marker { display: none; }
.inline-entity-create[open] summary { color: var(--primary-dark); }
.inline-entity-create .field { margin: 7px 0 0; padding: 11px; border: 1px solid var(--line); border-radius: 7px; background: #f8faf9; }
.inline-entity-create .field small { color: var(--muted); font-size: 11px; line-height: 1.5; }

@media (max-width: 1180px) {
  .kpi-grid { grid-template-columns: repeat(2,1fr); }
  .entity-card-grid { grid-template-columns: repeat(2,minmax(260px,1fr)); }
  .maintenance-stats { grid-template-columns: repeat(3,1fr); }
  .detail-dashboard { grid-template-columns: 1fr; }
  .step-list form { grid-template-columns: repeat(2,1fr); }
  .work-log-layout { grid-template-columns: 1fr; }
  .work-log-add-form { position: static; }
}
@media (max-width: 900px) {
  .sidebar { position: relative; width: auto; max-height: none; padding: 16px 18px; }
  .sidebar .brand { margin: 0; padding-right: 50px; }
  .mobile-nav-toggle { display: grid; place-items: center; position: absolute; top: 18px; right: 18px; width: 40px; height: 40px; border: 1px solid rgba(45,51,53,.18); border-radius: 8px; background: rgba(255,255,255,.66); color: #2d3335; font-size: 22px; cursor: pointer; }
  .sidebar nav { display: none; margin-top: 16px; }
  .sidebar.nav-open nav { display: grid; }
  .sidebar nav { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .sidebar .nav-section { display: contents; }
  .main { margin-left: 0; padding: 18px; }
  .dashboard-layout { display: flex; flex-direction: column; gap: 18px; }
  .dashboard-summary-cards { order: 5; }
  .dashboard-summary-cards .type-summary { margin-bottom: 0; }
  .dashboard-grid { display: contents; }
  .dashboard-deadlines { order: 1; }
  .dashboard-updates { order: 2; }
  .schedule-panel { order: 3; }
  .customer-summary-panel { order: 4; }
  .settings-grid { grid-template-columns: 1fr; }
  .status-settings-grid { grid-template-columns: 1fr; }
  .status-settings-masonry { grid-template-columns: 1fr; }
  .staff-member-form { grid-template-columns: 1fr; }
  .category-edit-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .status-option-form { grid-template-columns: 60px 1fr; }
  .status-option-form .button,
  .status-option-form .compact-check { grid-column: span 1; }
  .schedule-panel { grid-row: auto; overflow-x: auto; }
  .kpi-grid { grid-template-columns: repeat(2,1fr); }
  .entity-card-grid,.maintenance-sites { grid-template-columns: 1fr; }
  .record-summary { grid-template-columns: repeat(2,1fr); }
  .record-summary div:nth-child(2) { border-right: 0; }
  .timeline-section { overflow-x: auto; }
}
@media (max-width: 560px) {
  .project-new-site-fields { grid-template-columns: 1fr; }
  .kpi-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; margin-bottom: 10px; }
  .kpi-card { padding: 10px 12px; }
  .kpi-card span { font-size: 11px; }
  .kpi-card > div { margin: 3px 0 0; gap: 5px; }
  .kpi-card strong { font-size: 24px; line-height: 1.1; }
  .kpi-card > div b { font-size: 11px; }
  .kpi-card small { display: none; }
  .type-summary { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 6px; margin-bottom: 12px; }
  .type-summary a { display: grid; gap: 2px; justify-items: center; padding: 8px 6px; text-align: center; }
  .type-summary strong { margin: 0; font-size: 19px; line-height: 1; }
  .type-summary small,.type-summary em { margin: 0; font-size: 9px; }
  .type-title-badge { margin: 0; min-height: 20px; padding: 2px 7px; font-size: 9px; }
  .type-summary em { padding: 0; border: 0; }
  .mini-company-grid { grid-template-columns: 1fr; gap: 7px; }
  .customer-summary-panel { padding: 14px; }
  .customer-summary-panel .section-heading { align-items: center; margin-bottom: 10px; }
  .customer-summary-card { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 6px 10px; align-items: center; padding: 9px 10px; }
  .customer-summary-card header { gap: 7px; }
  .customer-summary-card header strong { font-size: 12px; }
  .customer-summary-card header small { font-size: 9px; }
  .customer-initial { width: 26px; height: 26px; flex-basis: 26px; font-size: 10px; }
  .customer-summary-card p { grid-column: 2; grid-row: 1; display: block; margin: 0; padding: 0; border: 0; text-align: right; font-size: 9px; white-space: nowrap; }
  .customer-summary-card p b { display: block; font-size: 13px; line-height: 1.1; }
  .customer-project-counts { grid-column: 1; display: flex; gap: 4px; }
  .customer-project-counts span { display: inline-flex; gap: 3px; min-height: 22px; padding: 3px 6px; font-size: 8px; }
  .customer-detail-button { grid-column: 2; min-height: auto; margin: 0; padding: 0; border: 0; color: var(--primary); font-size: 10px; white-space: nowrap; }
  .maintenance-stats,.record-summary { grid-template-columns: 1fr; }
  .entity-card-grid { grid-template-columns: minmax(0,1fr); }
  .record-summary div { border-right: 0; border-bottom: 1px solid var(--line); }
  .maintenance-actions { grid-template-columns: 1fr; }
  .calendar-day { grid-template-columns: 1fr; }
  .calendar-day .compact-list { border-left: 0; padding-left: 0; }
  .maintenance-report-upload { align-items: stretch; flex-direction: column; }
  .report-common-fields,.report-fields { grid-template-columns: 1fr; }
  .report-common-fields > div,.report-fields .wide { grid-column: auto; }
  .report-import-action { align-items: stretch; flex-direction: column; }
  .maintenance-import-actions { position: static; }
  .maintenance-plugin-row,.maintenance-log-add { grid-template-columns: 1fr; }
}

/* Operational list and record refinements */
.filter-grid { display: grid; grid-template-columns: minmax(220px,1.5fr) repeat(5,minmax(135px,.75fr)) auto; align-items: center; }
.filter-grid input,.filter-grid select { width: 100%; min-width: 0; }
.project-filter { display: grid; grid-template-columns: minmax(280px,1fr) minmax(0,2fr); gap: 10px 14px; align-items: start; margin-bottom: 10px; }
.project-keyword-search { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 8px; }
.project-keyword-search input { width: 100%; min-width: 0; }
.project-filter-details > summary { display: none; }
.project-filter-fields { display: grid; grid-template-columns: repeat(4,minmax(125px,1fr)) auto; gap: 10px; align-items: end; }
.project-filter-fields label { display: grid; gap: 5px; min-width: 0; color: var(--muted); font-size: 11px; font-weight: 700; }
.project-filter-fields input,.project-filter-fields select { width: 100%; min-width: 0; }
.project-filter-actions { display: flex; gap: 7px; }
.project-filter-actions .button { white-space: nowrap; }
.projects-filter-mobile { display: none; }
.active-filter-labels { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 6px; }
.active-filter-labels span { display: inline-flex; align-items: center; min-height: 25px; padding: 3px 9px; border: 1px solid #c9dfe3; border-radius: 999px; background: #f2f9fa; color: var(--primary-dark); font-size: 11px; font-weight: 700; }
.project-result-count { margin: 0 2px 7px; color: var(--muted); font-size: 12px; }
.project-result-count strong { margin-right: 2px; color: var(--text); font-size: 16px; }
.summary-kpis { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 14px; margin-bottom: 18px; }
.summary-kpis > div { padding: 17px 19px; border: 1px solid var(--line); border-radius: 8px; background: #fff; box-shadow: 0 3px 12px rgba(37,54,58,.045); }
.summary-kpis span { display: block; color: var(--muted); font-size: 12px; }
.summary-kpis strong { display: block; margin-top: 7px; font-size: 27px; }
.summary-kpis .ok strong { color: var(--maintenance); }
.summary-kpis .warn strong { color: #d66a2e; }
.company-grid { grid-template-columns: repeat(2,minmax(320px,1fr)); }
.customer-directory-filter { display: grid; grid-template-columns: minmax(280px,1fr) minmax(160px,.35fr) minmax(160px,.35fr) auto; gap: 10px; margin-bottom: 14px; }
.customer-directory-filter input,.customer-directory-filter select { width: 100%; min-width: 0; }
.customer-directory-table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 9px; background: #fff; box-shadow: 0 3px 12px rgba(37,54,58,.045); }
.customer-directory-table { width: 100%; min-width: 980px; border-collapse: collapse; table-layout: fixed; }
.customer-directory-table th,.customer-directory-table td { padding: 15px 16px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); vertical-align: top; text-align: left; }
.customer-directory-table thead th { background: #f2f4f3; color: #566064; font-size: 12px; letter-spacing: .02em; }
.customer-directory-table thead th:nth-child(1) { width: 24%; }.customer-directory-table thead th:nth-child(2) { width: 22%; }.customer-directory-table thead th:nth-child(3) { width: 23%; }.customer-directory-table thead th:nth-child(4) { width: 31%; }
.customer-directory-table tr > *:last-child { border-right: 0; }
.customer-directory-table tbody:last-child tr:last-child > * { border-bottom: 0; }
.customer-directory-table tbody + tbody tr:first-child > * { border-top: 5px solid #eef1f0; }
.directory-company { background: #fafbfa; }
.directory-company > a:first-child { display: block; margin-bottom: 9px; color: var(--text); font-size: 16px; }
.directory-company .status-chip { margin-bottom: 8px; }
.directory-company small,.directory-brand small,.directory-domain small { display: block; margin-top: 5px; color: var(--muted); font-size: 11px; font-weight: 500; }
.directory-edit-link { margin-top: 13px; font-size: 11px !important; font-weight: 700; }
.directory-company .directory-add-brand { display: block; width: max-content; margin-top: 7px; color: var(--primary); font-size: 11px; font-weight: 700; }
.directory-company .directory-add-brand:hover { text-decoration: underline; }
.directory-brand > a,.directory-domain > a { color: var(--text); font-weight: 700; overflow-wrap: anywhere; }
.directory-brand { background: #fcfdfd; }
.directory-sites .directory-add-site { display: block; width: max-content; margin-top: 9px; color: var(--primary); font-size: 11px; font-weight: 700; }
.directory-sites .directory-add-site:hover { text-decoration: underline; }
.directory-brand-create { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 7px; align-items: end; margin-top: 11px; }
.directory-brand-create label { min-width: 0; }
.directory-brand-create label span { display: block; margin-bottom: 4px; color: var(--muted); font-size: 10px; font-weight: 700; }
.directory-brand-create input { width: 100%; min-width: 0; min-height: 32px; padding: 6px 8px; font-size: 12px; }
.directory-brand-create .button { min-height: 32px; padding: 6px 10px; }
.directory-unassigned { color: #939b9e; font-size: 12px; }
.directory-site-list { display: grid; gap: 8px; }
.directory-site-sort-item { display: grid; grid-template-columns: 24px minmax(0,1fr) auto; align-items: center; border: 1px solid #e4e8e7; border-radius: 7px; color: var(--text); background: #fff; transition: border-color .15s ease,background-color .15s ease,box-shadow .15s ease,opacity .15s ease; }
.directory-site-sort-item:hover { border-color: #a9c9d0; background: #f8fbfb; box-shadow: 0 3px 8px rgba(37,54,58,.06); }
.directory-site-sort-item.is-dragging { opacity: .45; border-style: dashed; box-shadow: none; }
.directory-site-link { display: block; min-width: 0; padding: 9px 7px; color: var(--text); }
.site-drag-handle { align-self: stretch; width: 24px; padding: 0; border: 0; border-right: 1px solid #edf0ef; border-radius: 7px 0 0 7px; background: transparent; color: #9aa4a7; cursor: grab; line-height: 1; letter-spacing: -3px; }
.site-drag-handle:hover { background: #edf5f5; color: var(--primary); }
.site-drag-handle:active { cursor: grabbing; }
.site-order-buttons { display: flex; gap: 2px; padding-right: 5px; }
.site-order-buttons button { display: grid; place-items: center; width: 24px; height: 25px; padding: 0; border: 1px solid transparent; border-radius: 5px; background: transparent; color: #7d898c; cursor: pointer; }
.site-order-buttons button:hover:not(:disabled) { border-color: #c5d7da; background: #edf5f5; color: var(--primary-dark); }
.site-order-buttons button:disabled { opacity: .25; cursor: default; }
.site-order-status { min-height: 14px; color: var(--muted); font-size: 10px; text-align: right; }
.directory-site-list strong { display: block; font-size: 13px; }
.directory-site-list small { display: block; margin-top: 4px; color: var(--muted); font-size: 10px; overflow-wrap: anywhere; }
.directory-site-list small span { color: var(--maintenance); }
.company-card { min-height: 190px; }
.card-statuses { display: grid; justify-items: end; gap: 5px; }
.card-counts.six { grid-template-columns: repeat(6,minmax(0,1fr)); }
.card-counts.six span { text-align: center; padding-inline: 4px; }
.entity-type-counts { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.entity-type-counts span { padding: 5px 8px; border-radius: 5px; font-size: 11px; }
.entity-type-counts .production { background: color-mix(in srgb,var(--production) 14%,#fff); color: var(--production); }
.entity-type-counts .maintenance { background: color-mix(in srgb,var(--maintenance) 14%,#fff); color: var(--maintenance); }
.entity-type-counts .spot { background: color-mix(in srgb,var(--spot) 14%,#fff); color: var(--spot); }
.company-meta { display: flex; gap: 22px; align-items: center; flex-wrap: wrap; margin: -7px 0 16px; color: var(--muted); font-size: 13px; }
.record-summary.seven { grid-template-columns: repeat(7,minmax(0,1fr)); }
.record-summary.seven div { text-align: center; }
.record-tabs { gap: 10px; padding: 0 10px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.record-tabs a { padding: 14px 16px; font-weight: 700; }
.brand-stack.rich a { align-items: center; }
.brand-stack.rich div { min-width: 0; }
.brand-stack.rich small { display: block; margin-top: 4px; }
.brand-card-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }
.brand-record-card { display: grid; gap: 8px; padding: 15px; border: 1px solid var(--line); border-radius: 8px; color: var(--text); }
.brand-record-card > small { color: var(--muted); }
.brand-record-card > div { display: flex; flex-wrap: wrap; gap: 5px; }
.brand-record-card > div span { padding: 4px 7px; border-radius: 5px; background: #f3f5f5; font-size: 10px; }
.brand-record-card > div .production { background: color-mix(in srgb,var(--production) 14%,#fff); color: var(--production); }
.brand-record-card > div .maintenance { background: color-mix(in srgb,var(--maintenance) 14%,#fff); color: var(--maintenance); }
.brand-record-card > div .spot { background: color-mix(in srgb,var(--spot) 14%,#fff); color: var(--spot); }
.brand-record-card > b { justify-self: end; color: var(--primary); font-size: 11px; }
.domain-tree.rich { margin-top: 22px; }
.domain-root { font-size: 16px; font-weight: 800; }
.tree-sites { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 7px; margin: 8px 0 0 20px; }
.tree-sites a { display: flex; justify-content: space-between; gap: 10px; padding: 9px 11px; border: 1px solid var(--line); border-radius: 6px; color: var(--text); }
.tree-sites span { color: var(--muted); font-size: 11px; }
.server-domain-summary { margin-bottom: 16px; }
.step-badge { display: inline-flex; padding: 4px 8px; border-radius: 6px; background: color-mix(in srgb,var(--production) 14%,#fff); color: var(--production); font-size: 11px; font-weight: 700; }
.progress-cell { min-width: 90px; }
.progress-cell span { font-size: 10px; font-weight: 700; }
.progress-cell i { display: block; height: 5px; margin-top: 4px; border-radius: 4px; background: #ececef; overflow: hidden; }
.progress-cell i b { display: block; height: 100%; border-radius: inherit; background: var(--production); }
.project-lower-grid { display: grid; grid-template-columns: minmax(0,1.6fr) minmax(300px,.8fr); gap: 18px; align-items: start; }
.spot-project-lower-grid { margin-top: 18px; }
.project-lower-grid .timeline-section { margin-top: 0; }
.production-schedule-panel { margin-top: 0; padding: 18px; }
.production-schedule-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin-bottom: 14px; }
.production-schedule-heading h2 { margin: 0; }
.production-schedule-heading p { margin: 6px 0 0; color: var(--muted); font-size: 12px; }
.timeline-period-switch { display: inline-flex; flex: 0 0 auto; padding: 3px; border: 1px solid var(--line); border-radius: 9px; background: #f5f4f1; }
.timeline-period-switch a { min-width: 58px; padding: 7px 10px; border-radius: 6px; color: var(--muted); font-size: 11px; font-weight: 700; text-align: center; }
.timeline-period-switch a:hover { color: var(--production); }
.timeline-period-switch a.is-active { background: #fff; color: var(--production); box-shadow: 0 1px 4px rgba(37,54,58,.12); }
.timeline-production-overview { --timeline-label-width: 430px; min-width: 900px; }
.timeline-production-overview .timeline-head > span { display: flex; align-items: center; padding: 8px 12px; color: var(--muted); font-size: 10px; font-weight: 700; }
.timeline-production-overview .timeline-project-group { margin-bottom: 12px; }
.timeline-production-overview .timeline-project-row > a { align-items: flex-start; min-height: 78px; padding-block: 10px; }
.timeline-production-overview .timeline-project-group .timeline-project-row > div { min-height: 78px; }
.timeline-production-overview .timeline-project-row .timeline-bar.timeline-project-bar { top: 31px; height: 15px; }
.timeline-project-info { display: grid; min-width: 0; flex: 1 1 auto; gap: 5px; }
.timeline-project-primary { display: flex; align-items: center; gap: 7px; min-width: 0; }
.timeline-project-primary > strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.timeline-project-primary .timeline-status-badge { margin-left: auto; }
.timeline-project-meta { display: flex; flex-wrap: wrap; gap: 3px 10px; min-width: 0; color: var(--muted); font-size: 9px; font-weight: 500; }
.timeline-project-meta > span { max-width: 145px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.timeline-project-progress { display: grid; grid-template-columns: auto minmax(60px,1fr); align-items: center; gap: 8px; color: var(--muted); font-size: 9px; font-weight: 600; }
.timeline-project-progress > span { display: flex; gap: 4px; }
.timeline-project-progress > span strong { color: var(--text); }
.timeline-project-progress > i { height: 4px; overflow: hidden; border-radius: 3px; background: #e6e9eb; }
.timeline-project-progress > i b { display: block; height: 100%; border-radius: inherit; background: var(--production); }
.timeline-unscheduled-label { position: absolute; z-index: 2; top: 50%; left: 12px; transform: translateY(-50%); padding: 3px 7px; border-radius: 5px; background: #f1f2f2; color: var(--muted); font-size: 9px; font-weight: 700; }
.production-support-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; margin-top: 18px; align-items: start; }
.subsection-title { margin-top: 24px !important; padding-top: 18px; border-top: 1px solid var(--line); }
.production-action { background: var(--production) !important; border-color: var(--production) !important; }
.maintenance-action { background: var(--maintenance) !important; border-color: var(--maintenance) !important; }
.spot-action { background: var(--spot) !important; border-color: var(--spot) !important; }
.spot-kpis > div:first-child { border-left: 4px solid var(--spot); }
.work-kind-badge { display: inline-flex; padding: 4px 7px; border-radius: 5px; background: color-mix(in srgb,var(--spot) 14%,#fff); color: var(--spot); font-size: 10px; font-weight: 700; }
.priority-badge,.spot-status { display: inline-flex; padding: 4px 7px; border-radius: 5px; background: #f2f4f4; font-size: 10px; font-weight: 700; white-space: nowrap; }
.priority-badge.高,.priority-badge.重要,.priority-badge.緊急 { background: #ffeded; color: #c94747; }
.spot-status { background: color-mix(in srgb,var(--spot) 14%,#fff); color: var(--spot); }
.spot-queue-summary { display: flex; gap: 8px; margin-bottom: 14px; overflow-x: auto; padding: 1px 1px 4px; scrollbar-width: thin; }
.spot-queue-summary a { display: flex; flex: 0 0 auto; align-items: center; gap: 10px; min-width: 104px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 8px; background: #fff; color: var(--muted); }
.spot-queue-summary a span { font-size: 11px; font-weight: 700; white-space: nowrap; }
.spot-queue-summary a strong { margin-left: auto; color: var(--text); font-size: 18px; line-height: 1; }
.spot-queue-summary a:hover { border-color: color-mix(in srgb,var(--spot) 45%,var(--line)); color: var(--spot); }
.spot-queue-summary a.is-active { border-color: color-mix(in srgb,var(--spot) 50%,#fff); background: color-mix(in srgb,var(--spot) 9%,#fff); color: var(--spot); box-shadow: inset 0 -2px 0 var(--spot); }
.spot-queue-summary a.is-alert strong { color: #c9563f; }
.spot-queue-table table { table-layout: fixed; }
.spot-queue-table th:nth-child(1) { width: 34%; }
.spot-queue-table th:nth-child(2) { width: 19%; }
.spot-queue-table th:nth-child(3) { width: 16%; }
.spot-queue-table th:nth-child(4) { width: 15%; }
.spot-queue-table th:nth-child(5) { width: 16%; }
.spot-queue-table tbody tr { position: relative; }
.spot-queue-table tbody tr.is-due-soon td:first-child { box-shadow: inset 4px 0 #e7a23a; }
.spot-queue-table tbody tr.is-overdue td:first-child { box-shadow: inset 4px 0 #d9534f; }
.spot-queue-table tbody tr.is-due-soon { background: #fffdf8; }
.spot-queue-table tbody tr.is-overdue { background: #fff9f8; }
.spot-queue-badges { display: flex; align-items: flex-start; gap: 5px; flex-wrap: wrap; }
.spot-queue-tasks { display: flex; align-items: center; gap: 4px; margin-top: 8px; min-width: 0; flex-wrap: wrap; }
.spot-queue-tasks > small { flex: 0 0 100%; margin: 0 !important; color: var(--muted); font-size: 9px; font-weight: 700; }
.spot-queue-tasks .current-step-badge { max-width: 150px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.spot-queue-tasks > .muted { font-size: 10px; }
.spot-total-hours { color: var(--spot); font-size: 16px; }
.spot-due-date { font-weight: 700; }
.is-overdue .spot-due-date { color: #c74743; }
.is-due-soon .spot-due-date { color: #b7781d; }
.spot-queue-pagination { display: flex; align-items: center; justify-content: center; gap: 12px; margin-top: 14px; }
.spot-queue-pagination span { color: var(--muted); font-size: 12px; font-weight: 700; }
.spot-recent-completed { margin-top: 18px; }
.maintenance-note { grid-column: 1/-1; }
.maintenance-note input { min-height: 34px; }
.checklist footer { grid-column: 1/-1; color: var(--muted); font-size: 10px; }
.maintenance-status-完了 { background: color-mix(in srgb,var(--maintenance) 14%,#fff); color: var(--maintenance-text) !important; }
.maintenance-status-作業中 { background: #eaf2fb; color: #27679b !important; }
.maintenance-status-要確認 { background: #fff0e8; color: #ad5124 !important; }

/* Monthly maintenance workspace */
.maintenance-toolbar { display: flex; align-items: center; gap: 8px; margin-bottom: 18px; }
.maintenance-toolbar form { display: flex; align-items: center; gap: 8px; }
.maintenance-toolbar input { width: auto; min-height: 36px; }
.maintenance-toolbar-note { margin-left: auto; color: var(--muted); font-size: 11px; }
.maintenance-overview { display: grid; grid-template-columns: 1.3fr repeat(4,1fr); margin-bottom: 16px; overflow: hidden; border: 1px solid var(--line); border-radius: 10px; background: #fff; box-shadow: 0 3px 12px rgba(37,54,58,.045); }
.maintenance-overview > div { position: relative; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 8px; min-height: 86px; padding: 16px 18px; border-right: 1px solid var(--line); }
.maintenance-overview > div:last-child { border-right: 0; }
.maintenance-overview span { color: var(--muted); font-size: 12px; }
.maintenance-overview strong { font-size: 26px; color: #26383e; }
.maintenance-overview-total { display: block !important; background: var(--maintenance-surface); border-top: 3px solid var(--maintenance); }
.maintenance-overview-total span,.maintenance-overview-total small { display: block; }
.maintenance-overview-total strong { display: inline-block; margin: 4px 8px 0 0; font-size: 34px; }
.maintenance-overview-total small { display: inline-block; color: var(--maintenance); font-size: 11px; font-weight: 700; }
.status-dot { width: 9px; height: 9px; border-radius: 50%; background: #bcc5c4; }
.status-dot.working { background: #5a93c3; }.status-dot.confirm { background: #e89455; }.status-dot.done { background: var(--maintenance); }
.maintenance-filter { display: grid; grid-template-columns: minmax(240px,1fr) 210px auto; gap: 8px; margin-bottom: 14px; }
.maintenance-filter-details > summary { display: none; }
.maintenance-filter-details:not([open]) > .maintenance-filter { display: grid; }
.maintenance-worklist { padding: 0; overflow: hidden; }
.maintenance-worklist .section-heading { padding: 18px 20px 12px; margin: 0; }
.maintenance-worklist .section-heading small,.maintenance-report-meta .section-heading small,.maintenance-log-add small,.maintenance-editor-header small { color: var(--maintenance-text); font-size: 9px; font-weight: 800; letter-spacing: .12em; }
.maintenance-worklist .section-heading h2 { margin-top: 3px; font-size: 18px; }
.maintenance-worklist .section-heading > span { color: var(--muted); font-size: 12px; }
.maintenance-worklist table { min-width: 1000px; }
.maintenance-worklist th { background: #f6f8f7; color: var(--muted); font-size: 10px; letter-spacing: .04em; }
.maintenance-worklist td { padding-top: 14px; padding-bottom: 14px; vertical-align: middle; }
.maintenance-worklist td strong,.maintenance-worklist td small { display: block; }
.maintenance-worklist td small { margin-top: 4px; font-size: 11px; }
.maintenance-period-badge { display: inline-flex; padding: 5px 8px; border: 1px solid var(--maintenance-border); border-radius: 5px; color: var(--maintenance-text); background: var(--maintenance-surface); font-size: 11px; font-weight: 700; }
.entry-state { color: var(--muted); font-size: 11px; }
.entry-state.has-entry { color: #3e6860; font-weight: 700; }
.maintenance-status { display: inline-flex; width: max-content; padding: 5px 9px; border-radius: 999px; background: #edf1f0; color: #5b6766; font-size: 11px; font-weight: 800; white-space: nowrap; }
.maintenance-status-未対応 { background: #edf1f0; color: #5b6766 !important; }
.maintenance-status-作業中 { background: #eaf2fb; color: #27679b !important; }
.maintenance-status-要確認 { background: #fff0e8; color: #ad5124 !important; }
.maintenance-status-対応完了 { background: var(--maintenance-surface-raised); color: var(--maintenance-text) !important; }
.muted-text { color: var(--muted); font-size: 11px; }

.maintenance-project-summary { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); margin-bottom: 16px; overflow: hidden; border: 1px solid var(--maintenance-border); border-radius: 9px; background: var(--maintenance-surface); }
.maintenance-project-summary > div { min-width: 0; padding: 15px 18px; border-right: 1px solid var(--maintenance-border); }
.maintenance-project-summary > div:last-child { border-right: 0; }
.maintenance-project-summary span { display: block; margin-bottom: 5px; color: var(--maintenance-text); font-size: 10px; }
.maintenance-project-summary strong { display: block; overflow-wrap: anywhere; font-size: 14px; }
.maintenance-entry-guide { display: flex; align-items: center; max-width: 740px; margin: 5px auto 20px; color: var(--muted); font-size: 11px; font-weight: 700; }
.maintenance-entry-guide span { display: flex; align-items: center; gap: 7px; white-space: nowrap; }
.maintenance-entry-guide b { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: #e9eeec; color: #68716f; }
.maintenance-entry-guide .is-current { color: var(--maintenance); }.maintenance-entry-guide .is-current b { background: var(--maintenance); color: #fff; }
.maintenance-entry-guide i { flex: 1; height: 1px; margin: 0 12px; background: var(--line); }
.maintenance-report-meta { margin-bottom: 14px; }
.maintenance-report-meta .section-heading { align-items: flex-start; }
.maintenance-report-meta .section-heading h2 { margin-top: 4px; }
.maintenance-report-meta .section-heading p { margin: 5px 0 0; color: var(--muted); font-size: 12px; }
.maintenance-meta-fields { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; padding-top: 16px; border-top: 1px solid var(--line); }
.import-source-note { margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--line); color: var(--muted); font-size: 11px; }
.import-source-note summary { cursor: pointer; }.import-source-note pre { max-height: 300px; overflow: auto; padding: 12px; border-radius: 6px; background: #f7f8f8; white-space: pre-wrap; font: inherit; line-height: 1.6; }
.maintenance-log-add { grid-template-columns: minmax(280px,1fr) minmax(300px,1.2fr) auto; padding: 16px 20px; }
.maintenance-log-add h2 { margin-top: 3px; font-size: 16px; }
.maintenance-report-command { margin-bottom: 14px; padding: 16px 18px; }
.maintenance-report-command-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.maintenance-report-command-heading h2 { margin: 0; font-size: 17px; }
.maintenance-report-command-heading h2 span { display: inline-flex; margin-left: 7px; padding: 3px 7px; border-radius: 999px; background: var(--maintenance-surface-raised); color: var(--maintenance-text); font-size: 10px; vertical-align: 2px; }
.maintenance-report-command-heading p { margin: 4px 0 0; color: var(--muted); font-size: 11px; }
.maintenance-report-toolbar { display: grid; grid-template-columns: minmax(260px,1fr) 170px auto; align-items: end; gap: 10px; margin-top: 13px; padding-top: 13px; border-top: 1px solid var(--line); }
.maintenance-report-toolbar .field { margin: 0; }
.maintenance-report-toolbar .field span { font-size: 10px; }
.maintenance-report-toolbar .button-row { align-items: center; justify-content: flex-end; flex-wrap: nowrap; }
.maintenance-report-toolbar [data-maintenance-report-count] { margin-right: 3px; color: var(--muted); font-size: 10px; white-space: nowrap; }
.maintenance-log-add-disclosure { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--line); }
.maintenance-log-add-disclosure > summary { display: inline-flex; list-style: none; cursor: pointer; }
.maintenance-log-add-disclosure > summary::-webkit-details-marker { display: none; }
.maintenance-log-add-disclosure[open] > summary { background: color-mix(in srgb,var(--maintenance) 11%,#fff); color: var(--maintenance); }
.maintenance-log-add-disclosure .maintenance-log-add { margin: 10px 0 0; padding: 12px; border: 1px solid var(--line); border-radius: 8px; background: #f8faf9; }
.maintenance-log-add-disclosure .maintenance-log-add strong { font-size: 12px; }
.maintenance-log-add-disclosure .maintenance-log-add p { font-size: 10px; }
.maintenance-report-tools { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 14px; padding: 14px 16px; }
.maintenance-report-tools > div:first-child { display: grid; grid-template-columns: minmax(240px,1fr) 180px; gap: 10px; flex: 1; }
.maintenance-report-tools .field span { font-size: 10px; }
.maintenance-report-tools .button-row { align-items: center; }
.maintenance-report-tools [data-maintenance-report-count] { margin-right: 4px; color: var(--muted); font-size: 11px; white-space: nowrap; }
.maintenance-report-edit-stack { gap: 20px; }
.panel.maintenance-report-editor { padding: 0; overflow: hidden; border: 1.5px solid var(--maintenance-border); background: var(--maintenance-surface); }
.panel.maintenance-report-editor:has(.maintenance-report-accordion[open]) { border-color: var(--maintenance-border-strong); box-shadow: 0 8px 24px var(--maintenance-shadow); }
.maintenance-report-editor[hidden] { display: none !important; }
.maintenance-report-accordion { margin: 0; }
.maintenance-report-accordion > summary { list-style: none; }
.maintenance-report-accordion > summary::-webkit-details-marker { display: none; }
.maintenance-editor-header { display: grid; grid-template-columns: auto minmax(0,1fr) auto auto; align-items: center; gap: 13px; padding: 16px 20px; background: var(--maintenance-surface-raised); cursor: pointer; transition: box-shadow .15s ease; }
.main .maintenance-editor-header:hover { border-radius: 7px; background: var(--maintenance-surface-strong); color: var(--text); box-shadow: inset 0 0 0 1px var(--maintenance-border-strong); }
.maintenance-report-accordion[open] .maintenance-editor-header { border-bottom: 1px solid var(--maintenance-border-strong); background: var(--maintenance-active); }
.main .maintenance-report-accordion[open] .maintenance-editor-header:hover { background: var(--maintenance-hover); }
.maintenance-report-accordion[open] .maintenance-editor-header h2 { color: #16230f; }
.maintenance-report-accordion[open] .maintenance-accordion-title > span { color: var(--maintenance-text); }
.maintenance-report-accordion[open] .maintenance-accordion-metrics b { background: rgba(255,255,255,.78); color: #17211e; }
.maintenance-report-accordion[open] .maintenance-site-number { background: rgba(255,255,255,.78); color: var(--maintenance-text); }
.maintenance-report-accordion[open] .maintenance-accordion-chevron { border-color: var(--maintenance-text); }
.main .maintenance-editor-header:hover h2 { color: var(--text); }
.maintenance-site-number { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 8px; background: var(--maintenance-surface-strong); color: var(--maintenance-text); font-size: 13px; font-weight: 800; }
.maintenance-editor-header h2 { margin: 2px 0; font-size: 18px; }
.maintenance-accordion-title > span { color: #536047; font-size: 11px; }
.maintenance-accordion-metrics { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 9px; }
.maintenance-accordion-metrics b { padding: 4px 7px; border-radius: 5px; background: rgba(255,255,255,.76); color: #45553a; font-size: 10px; font-weight: 700; }
.maintenance-accordion-chevron { width: 10px; height: 10px; margin-right: 3px; border-right: 2px solid #60764d; border-bottom: 2px solid #60764d; transform: rotate(45deg) translateY(-2px); transition: transform .18s ease; }
.maintenance-report-accordion[open] .maintenance-accordion-chevron { transform: rotate(225deg) translate(-2px,-2px); }
.maintenance-accordion-content { padding-bottom: 1px; }
.maintenance-site-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; padding: 16px 20px 0; }
.maintenance-report-editor .report-form-section { margin: 14px 20px 0; padding: 18px; background: #fbfcfc; }
.maintenance-report-editor .report-form-section legend { color: var(--maintenance-text); }
.maintenance-report-editor .report-section-accordion { padding: 0; overflow: hidden; }
.report-section-accordion > summary { display: grid; grid-template-columns: minmax(150px,auto) minmax(0,1fr) auto; align-items: center; gap: 14px; min-height: 52px; padding: 10px 16px; list-style: none; cursor: pointer; }
.report-section-accordion > summary::-webkit-details-marker { display: none; }
.report-section-accordion > summary strong { color: #33524b; font-size: 14px; }
.report-section-accordion > summary span { overflow: hidden; color: var(--muted); font-size: 11px; text-align: right; text-overflow: ellipsis; white-space: nowrap; }
.report-section-accordion > summary i { width: 8px; height: 8px; margin-right: 3px; border-right: 2px solid #6d817c; border-bottom: 2px solid #6d817c; transform: rotate(45deg); transition: transform .15s ease; }
.report-section-accordion[open] > summary { border-bottom: 1px solid var(--line); background: #f3f9f7; }
.report-section-accordion[open] > summary i { transform: rotate(225deg); }
.report-section-accordion > summary:hover { background: #f3f9f7; }
.report-section-body { padding: 16px; }
.report-section-body.maintenance-plugin-rows { padding: 0; }
.maintenance-editor-actions { display: flex; align-items: center; justify-content: flex-end; gap: 18px; margin-top: 20px; padding: 16px 20px; border-top: 1px solid var(--line); background: #f7faf9; }
.maintenance-editor-actions p { margin: 0 auto 0 0; color: var(--muted); font-size: 11px; }

/* サイト別作業レポートは、入力場所を見つけやすい高コントラスト表示にする */
.maintenance-report-editor .maintenance-accordion-content { background: var(--maintenance-surface); }
.maintenance-report-editor .report-form-section { border-color: var(--maintenance-border); background: var(--maintenance-surface-raised); }
.maintenance-report-editor .maintenance-basic-section { border-color: var(--maintenance-border-strong) !important; background: var(--maintenance-surface-strong) !important; }
.maintenance-report-editor .maintenance-site-reference { border-color: var(--maintenance-border); background: #fff; }
.maintenance-report-editor .maintenance-site-reference dl { border-color: var(--maintenance-border); background: var(--maintenance-border); }
.maintenance-report-editor .maintenance-site-reference dl > div { background: var(--maintenance-surface-raised); }
.maintenance-report-editor .field > span,
.maintenance-log-add-disclosure .field > span { color: #34442c; font-size: 13px; font-weight: 700; }
.maintenance-report-editor .field small { color: #536047; font-size: 12px; line-height: 1.55; }
.maintenance-report-editor input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]),
.maintenance-report-editor select,
.maintenance-report-editor textarea,
.maintenance-report-command input,
.maintenance-report-command select,
.maintenance-log-add-disclosure input,
.maintenance-log-add-disclosure select {
  min-height: 44px;
  border: 1.5px solid #718069;
  background: #fff;
  color: #17211e;
  font-size: 16px;
  line-height: 1.5;
}
.maintenance-report-editor textarea { padding: 11px 12px; }
.maintenance-report-editor input::placeholder,
.maintenance-report-editor textarea::placeholder,
.maintenance-report-command input::placeholder { color: #66736f; opacity: 1; }
.maintenance-report-editor input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):hover,
.maintenance-report-editor select:hover,
.maintenance-report-editor textarea:hover,
.maintenance-report-command input:hover,
.maintenance-report-command select:hover { border-color: #4d6044; }
.maintenance-report-editor input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):focus,
.maintenance-report-editor select:focus,
.maintenance-report-editor textarea:focus,
.maintenance-report-command input:focus,
.maintenance-report-command select:focus,
.maintenance-log-add-disclosure select:focus {
  border-color: var(--maintenance-text);
  outline: 0;
  box-shadow: 0 0 0 3px var(--maintenance-shadow);
}
.maintenance-report-editor .report-section-accordion > summary { background: var(--maintenance-surface); }
.maintenance-report-editor .report-section-accordion > summary strong { color: var(--maintenance-text); font-size: 15px; }
.maintenance-report-editor .report-section-accordion > summary span { color: #536047; font-size: 12px; }
.maintenance-report-editor .report-section-accordion[open] > summary { border-bottom-color: var(--maintenance-border-strong); background: var(--maintenance-surface-strong); }
.maintenance-report-editor .report-section-accordion > summary:hover { background: var(--maintenance-active); }
.maintenance-report-editor .maintenance-editor-actions { background: var(--maintenance-surface-raised); }

@media (max-width: 1050px) {
  .maintenance-overview { grid-template-columns: repeat(4,1fr); }.maintenance-overview-total { grid-column: 1/-1; }
  .maintenance-meta-fields { grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 720px) {
  .maintenance-toolbar { display: grid; grid-template-columns: auto minmax(0,1fr) auto; gap: 5px; flex-wrap: nowrap; }
  .maintenance-toolbar > .button { min-width: 0; padding-inline: 8px; white-space: nowrap; }
  .maintenance-toolbar form { display: grid; grid-template-columns: minmax(0,1fr) auto; min-width: 0; gap: 5px; }
  .maintenance-toolbar input { width: 100%; min-width: 0; }
  .maintenance-toolbar form .button { padding-inline: 10px; white-space: nowrap; }
  .maintenance-toolbar-note { width: 100%; margin-left: 0; }
  .maintenance-overview { grid-template-columns: repeat(2,1fr); }.maintenance-overview > div { border-bottom: 1px solid var(--line); }
  .maintenance-filter-details { margin-bottom: 14px; border: 1px solid var(--line); border-radius: 9px; background: #fff; }
  .maintenance-filter-details > summary { display: flex; align-items: center; justify-content: space-between; min-height: 44px; padding: 9px 13px; color: var(--text); font-size: 13px; font-weight: 700; cursor: pointer; list-style: none; }
  .maintenance-filter-details > summary::-webkit-details-marker { display: none; }
  .maintenance-filter-details > summary i { width: 8px; height: 8px; border-right: 2px solid var(--muted); border-bottom: 2px solid var(--muted); transform: rotate(45deg); transition: transform .15s ease; }
  .maintenance-filter-details[open] > summary i { transform: rotate(225deg); }
  .maintenance-filter-details:not([open]) > .maintenance-filter { display: none; }
  .maintenance-filter-details .maintenance-filter { grid-template-columns: 1fr; margin: 0; padding: 0 9px 9px; border: 0; box-shadow: none; }
  .maintenance-log-add,.maintenance-site-fields { grid-template-columns: 1fr; }
  .maintenance-project-summary { grid-template-columns: repeat(2,1fr); }
  .maintenance-project-summary > div:nth-child(2) { border-right: 0; }
  .maintenance-entry-guide { display: none; }
  .maintenance-report-meta .section-heading,.maintenance-editor-actions { align-items: stretch; flex-direction: column; }
  .maintenance-meta-fields { grid-template-columns: 1fr; }
  .maintenance-report-tools { align-items: stretch; flex-direction: column; }.maintenance-report-tools > div:first-child { width: 100%; grid-template-columns: 1fr; }.maintenance-report-tools .button-row { width: 100%; flex-wrap: wrap; }
  .maintenance-report-toolbar { grid-template-columns: 1fr; }
  .maintenance-report-toolbar .button-row { grid-column: 1 / -1; justify-content: flex-start; }
  .maintenance-editor-header { grid-template-columns: auto 1fr auto; }.maintenance-editor-header .maintenance-status { grid-column: 2; }.maintenance-accordion-chevron { grid-column: 3; grid-row: 1/3; }
  .maintenance-accordion-metrics { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
  .maintenance-report-editor .report-form-section { margin-inline: 12px; }
  .report-section-accordion > summary { grid-template-columns: minmax(0,1fr) auto; gap: 8px; }
  .report-section-accordion > summary span { grid-column: 1; grid-row: 2; text-align: left; }
  .report-section-accordion > summary i { grid-column: 2; grid-row: 1/3; }
}

/* Customer-by-month maintenance cards */
.maintenance-check-groups { display: grid; gap: 16px; }
.maintenance-check-group { overflow: hidden; border: 1px solid var(--line); border-radius: 10px; background: #fff; box-shadow: 0 3px 12px rgba(37,54,58,.045); }
.maintenance-check-group > header { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 64px; padding: 12px 18px; border-bottom: 1px solid var(--line); background: #f8faf9; }
.maintenance-check-group > header > div { display: flex; align-items: center; gap: 12px; }
.maintenance-check-group > header > div > strong { font-size: 18px; }
.maintenance-check-group > header p { margin: 0; color: var(--muted); font-size: 12px; }
.maintenance-check-group > header p b { color: var(--maintenance); font-size: 18px; }
.maintenance-check-companies { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); column-gap: 28px; padding: 8px 18px 14px; }
.maintenance-check-company { min-width: 0; padding: 10px 0; }
.maintenance-check-company-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--line); }
.maintenance-check-company-heading h2 { flex: 1; border-bottom: 0; }
.maintenance-check-company-heading form { margin: 0; }
.maintenance-check-company h2 { margin: 0; border-bottom: 0; }
.maintenance-check-company h2 a { display: block; padding: 8px 2px; color: var(--text); font-size: 15px; }
.maintenance-check-company h2 a:hover { color: var(--maintenance); }
.maintenance-check-company h2 > span { display: block; padding: 8px 2px; color: var(--text); font-size: 15px; }
.maintenance-check-row { display: grid; grid-template-columns: minmax(0,1fr) 110px 62px; align-items: center; gap: 10px; min-height: 42px; padding: 6px 2px 6px 14px; border-bottom: 1px solid #edf0ef; color: var(--text); }
.maintenance-check-row:hover { background: #f7faf9; }
.maintenance-check-row > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
.maintenance-check-row > small { min-width: 0; overflow: hidden; color: var(--muted); text-overflow: ellipsis; white-space: nowrap; font-size: 9px; }
.maintenance-simple-status { justify-self: end; min-width: 56px; padding: 4px 7px; border-radius: 999px; background: #f1eeea; color: #625a54; text-align: center; font-size: 9px; }
.maintenance-check-row.is-完了 { color: #7a8583; }
.maintenance-check-row.is-完了 .maintenance-simple-status { background: color-mix(in srgb,var(--maintenance) 14%,#fff); color: var(--maintenance); }
.maintenance-check-row.is-作業中 .maintenance-simple-status { background: #eaf2fb; color: #27679b; }

.server-domain-summary > .section-heading { align-items: center; margin-bottom: 16px; }
.server-domain-summary > .section-heading p { margin: 4px 0 0; color: var(--muted); font-size: 11px; }
.site-secrets-layout { grid-template-columns: minmax(0,1.2fr) minmax(0,1fr); align-items: start; }
.site-secrets-registered,.secret-card { min-width: 0; }
.secret-card { overflow: hidden; }
.secret-card-heading { display: flex; justify-content: space-between; gap: 10px; }
.secret-card-value,.secret-card-notes { max-width: 100%; overflow-wrap: anywhere; word-break: break-word; }
.secret-card-actions { display: flex; align-items: flex-start; gap: 7px; flex-wrap: wrap; }
.secret-card-actions form { margin: 0; }
.secret-edit-details > summary { list-style: none; cursor: pointer; }
.secret-edit-details > summary::-webkit-details-marker { display: none; }
.secret-edit-details[open] { width: 100%; order: 4; }
.secret-edit-form { display: grid; grid-template-columns: 1fr; gap: 9px; margin-top: 9px; padding: 12px; border: 1px solid var(--line); border-radius: 8px; background: #f8faf9; }
.secret-edit-form small { color: var(--muted); font-size: 10px; }

.maintenance-project-cards { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; }
.maintenance-project-card { display: flex; flex-direction: column; min-width: 0; overflow: hidden; border: 1px solid var(--line); border-top: 3px solid var(--maintenance); border-radius: 10px; background: #fff; box-shadow: 0 4px 16px rgba(37,54,58,.06); }
.maintenance-project-card > header { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; padding: 18px 20px 15px; }
.maintenance-project-card > header small { color: var(--maintenance); font-size: 10px; font-weight: 800; letter-spacing: .08em; }
.maintenance-project-card > header h2 { margin: 4px 0 5px; font-size: 19px; }
.maintenance-project-card > header div > span { color: var(--muted); font-size: 11px; }
.maintenance-card-metrics { display: grid; grid-template-columns: repeat(4,1fr); border-block: 1px solid var(--line); background: #f8faf9; }
.maintenance-card-metrics > div { min-width: 0; padding: 11px 13px; border-right: 1px solid var(--line); }
.maintenance-card-metrics > div:last-child { border-right: 0; }
.maintenance-card-metrics span,.maintenance-card-metrics strong { display: block; }
.maintenance-card-metrics span { color: var(--muted); font-size: 9px; }
.maintenance-card-metrics strong { margin-top: 5px; overflow-wrap: anywhere; font-size: 17px; }
.maintenance-card-metrics > div:last-child strong { font-size: 11px; }
.maintenance-card-sites { display: grid; gap: 0; padding: 0 20px; }
.maintenance-card-sites > section { padding: 14px 0; border-bottom: 1px solid #edf0ef; }
.maintenance-card-sites > section:last-child { border-bottom: 0; }
.maintenance-card-site-title { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 9px; }
.maintenance-card-site-title strong { font-size: 13px; }
.maintenance-card-site-title .maintenance-status { padding: 3px 7px; font-size: 9px; }
.maintenance-card-sites dl { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 6px 14px; margin: 0; }
.maintenance-card-sites dl > div { display: grid; grid-template-columns: 82px minmax(0,1fr); gap: 6px; font-size: 10px; }
.maintenance-card-sites dt { color: var(--muted); }.maintenance-card-sites dd { margin: 0; overflow-wrap: anywhere; font-weight: 700; }
.maintenance-project-card > footer { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: auto; padding: 13px 20px; border-top: 1px solid var(--line); background: #f8faf9; }
.maintenance-project-card > footer span { color: var(--muted); font-size: 10px; }
.maintenance-card-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.maintenance-card-actions form { margin: 0; }
.maintenance-project-card.is-site-list { grid-column: 1/-1; }
.maintenance-expanded-sites { padding: 0 20px; }
.maintenance-expanded-sites-head,.maintenance-expanded-sites > a { display: grid; grid-template-columns: minmax(260px,1.8fr) 100px 130px 110px; gap: 14px; align-items: center; }
.maintenance-expanded-sites-head { padding: 10px 2px; border-bottom: 1px solid var(--line); color: var(--muted); font-size: 9px; font-weight: 700; }
.maintenance-expanded-sites > a { min-height: 58px; padding: 10px 2px; border-bottom: 1px solid #edf0ef; color: var(--text); }
.maintenance-expanded-sites > a:last-child { border-bottom: 0; }
.maintenance-expanded-sites > a:hover strong { color: var(--primary); }
.maintenance-expanded-sites strong,.maintenance-expanded-sites small { display: block; }
.maintenance-expanded-sites strong { font-size: 12px; }.maintenance-expanded-sites small { margin-top: 3px; color: var(--muted); font-size: 10px; }
.maintenance-expanded-sites > a > span:not(.maintenance-status) { color: var(--muted); font-size: 11px; }

/* Maintenance detail tabs */
.maintenance-tab-intro,.maintenance-overview-hero { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 14px; padding: 20px 22px; border: 1px solid var(--maintenance-border); border-radius: 9px; background: linear-gradient(120deg,var(--maintenance-surface-raised),#fff); }
.maintenance-tab-intro small,.maintenance-overview-hero small { color: var(--maintenance-text); font-size: 9px; font-weight: 800; letter-spacing: .12em; }
.maintenance-tab-intro h2,.maintenance-overview-hero h2 { margin: 4px 0 5px; font-size: 20px; }
.maintenance-tab-intro p,.maintenance-overview-hero p { margin: 0; color: var(--muted); font-size: 12px; }
.maintenance-tab-intro > strong { color: var(--maintenance); font-size: 13px; white-space: nowrap; }
.maintenance-overview-progress { text-align: right; }.maintenance-overview-progress strong,.maintenance-overview-progress span { display: block; }.maintenance-overview-progress strong { color: var(--maintenance); font-size: 34px; }.maintenance-overview-progress span { color: var(--muted); font-size: 10px; }
.maintenance-overview-kpis { display: grid; grid-template-columns: repeat(4,1fr); margin-bottom: 14px; border: 1px solid var(--line); border-radius: 9px; background: #fff; }
.maintenance-overview-kpis > div { padding: 14px 17px; border-right: 1px solid var(--line); }.maintenance-overview-kpis > div:last-child { border-right: 0; }
.maintenance-overview-kpis span,.maintenance-overview-kpis strong { display: block; }.maintenance-overview-kpis span { color: var(--muted); font-size: 10px; }.maintenance-overview-kpis strong { margin-top: 5px; font-size: 18px; }
.maintenance-overview-sites { margin-top: 14px; }
.maintenance-overview-sites > div:not(.section-heading) { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 11px 2px; border-bottom: 1px solid #edf0ef; }
.maintenance-overview-sites > div:last-child { border-bottom: 0; }.maintenance-overview-sites > div > div strong,.maintenance-overview-sites > div > div span { display: block; }.maintenance-overview-sites > div > div strong { font-size: 13px; }.maintenance-overview-sites > div > div span { margin-top: 3px; color: var(--muted); font-size: 10px; }
.maintenance-mail-summary { margin-top: 14px; }
.maintenance-mail-summary dl { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0; margin: 0; border: 1px solid var(--line); border-radius: 8px; overflow: hidden; }
.maintenance-mail-summary dl > div { min-width: 0; padding: 13px 16px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); background: #fff; }
.maintenance-mail-summary dl > div:nth-child(2n) { border-right: 0; }
.maintenance-mail-summary dl > div:nth-last-child(-n+2) { border-bottom: 0; }
.maintenance-mail-summary dt { margin-bottom: 5px; color: var(--muted); font-size: 10px; font-weight: 700; }
.maintenance-mail-summary dd { margin: 0; overflow-wrap: anywhere; font-size: 13px; font-weight: 700; }
.maintenance-basic-section { background: var(--maintenance-surface) !important; border-color: var(--maintenance-border) !important; }
.maintenance-basic-save { display: flex; justify-content: flex-end; margin-top: 12px; }
.maintenance-site-reference { margin: 16px 20px 0; padding: 17px 18px; border: 1px solid var(--line); border-radius: 8px; background: #fff; }
.maintenance-site-reference-heading { display: flex; justify-content: space-between; align-items: flex-start; gap: 18px; margin-bottom: 14px; }
.maintenance-site-reference-heading small { color: var(--maintenance-text); font-size: 9px; font-weight: 800; letter-spacing: .12em; }
.maintenance-site-reference-heading h3 { margin: 3px 0 4px; font-size: 16px; }
.maintenance-site-reference-heading p { margin: 0; color: var(--muted); font-size: 10px; }
.maintenance-site-reference dl { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1px; margin: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 7px; background: var(--line); }
.maintenance-site-reference dl > div { min-width: 0; padding: 11px 13px; background: #f8faf9; }
.maintenance-site-reference dt { margin-bottom: 5px; color: var(--muted); font-size: 9px; }
.maintenance-site-reference dd { margin: 0; overflow-wrap: anywhere; font-size: 11px; font-weight: 700; }
.maintenance-site-reference dd a { font-weight: 700; }
.maintenance-email-form { max-width: 1050px; }
.maintenance-email-form .report-email-body { min-height: 360px; }
.maintenance-email-form .form-actions { justify-content: flex-end; margin-top: 16px; }
.mail-status { padding: 6px 10px; border-radius: 999px; background: #edf1f0; color: #5b6766; font-size: 11px; font-weight: 800; white-space: nowrap; }
.mail-status-下書き { background: #fff0e8; color: #ad5124; }.mail-status-送信済み { background: color-mix(in srgb,var(--maintenance) 14%,#fff); color: var(--maintenance); }
.source-report-panel { padding: 0; overflow: hidden; }
.source-report-meta { display: flex; gap: 12px; padding: 14px 18px; border-bottom: 1px solid var(--line); background: #f8faf9; font-size: 11px; }.source-report-meta span { color: var(--muted); }
.source-report-panel pre { max-height: 70vh; margin: 0; overflow: auto; padding: 22px; background: #fff; white-space: pre-wrap; overflow-wrap: anywhere; font: inherit; font-size: 12px; line-height: 1.75; }

@media (max-width: 1100px) {
  .maintenance-check-companies { grid-template-columns: 1fr; }
  .maintenance-project-cards { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .maintenance-check-group > header { align-items: flex-start; }
  .maintenance-check-group > header > div { align-items: flex-start; flex-direction: column; gap: 6px; }
  .maintenance-check-companies { padding-inline: 12px; }
  .maintenance-check-row { grid-template-columns: minmax(0,1fr) 58px; min-height: 44px; padding-left: 8px; }
  .maintenance-check-row > small { display: none; }
  .maintenance-card-metrics,.maintenance-overview-kpis { grid-template-columns: repeat(2,1fr); }
  .maintenance-card-metrics > div:nth-child(2),.maintenance-overview-kpis > div:nth-child(2) { border-right: 0; }
  .maintenance-card-sites dl { grid-template-columns: 1fr; }
  .maintenance-tab-intro,.maintenance-overview-hero { align-items: flex-start; flex-direction: column; }
  .maintenance-overview-progress { text-align: left; }
  .maintenance-site-reference { margin-inline: 12px; }
  .maintenance-site-reference-heading { flex-direction: column; }
  .maintenance-site-reference dl { grid-template-columns: 1fr; }
  .maintenance-expanded-sites { padding-inline: 12px; overflow-x: auto; }
  .maintenance-expanded-sites-head,.maintenance-expanded-sites > a { min-width: 680px; }
}

@media (max-width: 1250px) {
  .filter-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .record-summary.seven { grid-template-columns: repeat(4,minmax(0,1fr)); }
  .brand-card-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .project-lower-grid { grid-template-columns: 1fr; }
}
@media (max-width: 900px) {
  .summary-kpis { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .company-grid,.brand-card-grid,.tree-sites { grid-template-columns: 1fr; }
  .card-counts.six { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .record-summary.seven { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .customer-directory-filter { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .nav-data-details { border-top: 0; padding-top: 0; }
  .production-schedule-heading { align-items: stretch; flex-direction: column; }
  .timeline-period-switch { align-self: flex-start; }
  .production-support-grid { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .filter-grid,.summary-kpis { grid-template-columns: 1fr; }
  .customer-directory-filter { grid-template-columns: 1fr; }
  .record-tabs { padding: 0; }
}

/* Figma palette */
:root {
  --bg: #FFFDFB;
  --panel: #fff;
  --text: #20272b;
  --muted: #817470;
  --line: #ded8d2;
  --primary: #ed643e;
  --primary-dark: #c84c2a;
  --danger: #d32a2d;
  --ok: #2e9d64;
  --soft: #fff0e8;
  --sidebar: #514740;
  --production: #5846b6;
  --maintenance: #2e9d64;
  --spot: #ed643e;
  --accent-blue: #1c8196;
  --accent-pink: #de38ad;
}

body { background: var(--bg); color: var(--text); }
.sidebar {
  background: var(--sidebar);
  color: #fcfbf2;
  border-right-color: #817470;
}
.brand-mark {
  background: var(--primary);
  color: #fcfbf2;
  box-shadow: 0 4px 14px rgba(237,100,62,.26);
}
.brand small,
.sidebar a,
.nav-data-details summary { color: #e5ded1; }
.sidebar a.is-active,
.sidebar a:hover,
.nav-data-details summary:hover,
.nav-data-details summary.is-active {
  background: rgba(252,251,242,.12);
  color: #fcfbf2;
}
.sidebar .nav-section,
.nav-data-details { border-color: rgba(252,251,242,.15); }
.nav-logout { color: #ffb8a7 !important; }

.panel,
.stat,
.project-summary,
.record-summary,
.kpi-card,
.entity-card,
.customer-summary-card,
.filter-bar,
.auth-card,
.settings-link,
.maintenance-stats > div,
.maintenance-project-card,
.company-maintenance,
.report-form-section,
.maintenance-site-reference,
.maintenance-overview-kpis,
.maintenance-mail-summary dl > div {
  background: var(--panel);
  border-color: var(--line);
}
.button.primary,
.tabs a.is-active {
  border-color: var(--primary);
}
.button.primary,
.production-action,
.maintenance-action,
.spot-action {
  background: var(--primary) !important;
  border-color: var(--primary) !important;
  color: #fff !important;
}
.button.primary:visited,
.production-action:visited,
.maintenance-action:visited,
.spot-action:visited {
  color: #fff !important;
}
.main .button.primary:hover,
.button.primary:hover {
  color: #fff !important;
  background: var(--primary-dark) !important;
  border-color: var(--primary-dark) !important;
}
a,
.main a[href],
.section-heading a,
.tabs a.is-active,
.entity-card footer b,
.customer-detail-button:hover,
.maintenance-expanded-sites > a:hover strong {
  color: var(--text);
}
.main a[href]:hover,
.tabs a:hover {
  color: #514740;
}
.kpi-card small,
.imported-report-list > a > span,
.imported-history-item > b,
.inline-entity-create summary,
.directory-company .directory-add-brand,
.directory-sites .directory-add-site,
.brand-record-card > b {
  color: var(--text);
}

input,
select,
textarea,
.button,
.category-drag-handle,
.status-drag-handle {
  background: #fffdf8;
  border-color: var(--line);
}
.date-picker-button,
.category-drag-handle:hover,
.status-drag-handle:hover,
.site-drag-handle:hover,
.site-order-buttons button:hover:not(:disabled),
.tabs a:hover,
.main summary:hover {
  background: #fff0e8;
  color: var(--primary-dark);
}

.customer-project-counts .production,
.card-counts .production,
.entity-type-counts .production,
.brand-record-card > div .production,
.step-badge {
  background: color-mix(in srgb,var(--production) 14%,#fff);
  color: var(--production);
}
.customer-project-counts .maintenance,
.card-counts .maintenance,
.entity-type-counts .maintenance,
.brand-record-card > div .maintenance,
.maintenance-status-完了,
.maintenance-status-対応完了,
.mail-status-送信済み {
  background: color-mix(in srgb,var(--maintenance) 14%,#fff);
  color: var(--maintenance) !important;
}
.customer-project-counts .spot,
.card-counts .spot,
.entity-type-counts .spot,
.brand-record-card > div .spot,
.work-kind-badge,
.spot-status,
.spot-status-badge {
  background: color-mix(in srgb,var(--spot) 14%,#fff);
  color: var(--spot);
}
.maintenance-action { background: var(--maintenance) !important; border-color: var(--maintenance) !important; }
.customer-initial,
.entity-avatar {
  background: color-mix(in srgb,var(--accent-blue) 16%,#fff);
  color: var(--accent-blue);
}
.pill,
.status-chip,
.project-status-badge,
.maintenance-status,
.billing-status,
.mail-status {
  background: #f1eeea;
  color: #514740 !important;
}
.project-status-未対応,
.project-status-未着手,
.project-status-相談中 {
  background: #f1eeea;
  color: #514740 !important;
}
.project-status-作業中,
.project-status-進行中,
.project-status-制作中 {
  background: color-mix(in srgb,var(--accent-blue) 14%,#fff);
  color: var(--accent-blue) !important;
}
.project-status-要確認,
.project-status-確認中 {
  background: #fff0e8;
  color: var(--primary-dark) !important;
}
.project-status-対応完了,
.project-status-完了,
.project-status-公開済み {
  background: color-mix(in srgb,var(--maintenance) 14%,#fff);
  color: var(--maintenance) !important;
}
.project-status-badge[style*="--status-color"] {
  background: color-mix(in srgb,var(--status-color) 14%,#fff);
  color: var(--status-text-color, var(--status-color)) !important;
}
.project-status-badge.is-solid {
  background: var(--status-color) !important;
  color: #fff !important;
}
.maintenance-status-作業中 {
  background: color-mix(in srgb,var(--accent-blue) 14%,#fff);
  color: var(--accent-blue) !important;
}
.maintenance-status-要確認,
.maintenance-status-未対応,
.billing-status.is-unbilled,
.mail-status-下書き,
.report-preview-heading > b {
  background: #fff0e8;
  color: var(--primary-dark) !important;
}
.flash,
.bill-toggle.is-on,
.match-ok {
  background: color-mix(in srgb,var(--ok) 13%,#fff);
  color: var(--ok);
}
.flash.danger,
.report-preview-error,
.report-import-errors {
  background: #fff1f0;
  color: var(--danger);
}
.spot-project-summary,
.spot-new-company-fields,
.spot-overview-hero {
  border-color: color-mix(in srgb,var(--spot) 26%,#fff);
  background: color-mix(in srgb,var(--spot) 8%,#fff);
}
.maintenance-project-summary,
.maintenance-tab-intro,
.maintenance-overview-hero,
.maintenance-basic-section {
  border-color: color-mix(in srgb,var(--maintenance) 26%,#fff) !important;
  background: color-mix(in srgb,var(--maintenance) 8%,#fff) !important;
}

@media (max-width: 900px) {
  .spot-header-actions { margin-top: 12px; }
  .spot-header-actions > .button { margin-top: 0; }
  .spot-more-actions > summary.button { margin-top: 0; }
  .spot-project-summary { grid-template-columns: minmax(150px,.75fr) minmax(0,1.5fr); }
  .spot-summary-date { grid-column: 1 / -1; display: flex; justify-content: space-between; align-items: center; padding-block: 10px !important; border-top: 1px solid #f3dfd2; }
  .spot-summary-date span { margin: 0; }
  .project-filter { grid-template-columns: 1fr; gap: 8px; margin-bottom: 8px; }
  .projects-filter-desktop { display: none; }
  .projects-filter-mobile { display: block; margin-bottom: 16px; }
  .project-filter-details { border: 1px solid var(--line); border-radius: 9px; background: #fff; }
  .project-filter-details > summary { display: flex; align-items: center; justify-content: space-between; min-height: 42px; padding: 9px 13px; color: var(--text); font-size: 13px; font-weight: 700; cursor: pointer; list-style: none; }
  .project-filter-details > summary::-webkit-details-marker { display: none; }
  .project-filter-details > summary i { width: 8px; height: 8px; border-right: 2px solid var(--muted); border-bottom: 2px solid var(--muted); transform: rotate(45deg); transition: transform .15s ease; }
  .project-filter-details[open] > summary i { transform: rotate(225deg); }
  .project-filter-fields { grid-template-columns: repeat(2,minmax(0,1fr)); padding: 4px 12px 12px; border-top: 1px solid var(--line); }
  .project-filter-actions { grid-column: 1 / -1; }
  .project-filter-actions .button { flex: 1; text-align: center; }
  .active-filter-labels { grid-column: auto; gap: 5px; }
  .active-filter-labels span { min-height: 22px; padding: 2px 7px; font-size: 10px; }
  .project-result-count { margin-top: 3px; }
}

@media (max-width: 560px) {
  .spot-header-actions { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); }
  .spot-header-actions > .button,.spot-more-actions > summary { justify-content: center; width: 100%; }
  .spot-more-actions > div { width: min(190px,calc(100vw - 36px)); }
  .spot-project-summary { grid-template-columns: 1fr; margin-bottom: 12px; }
  .spot-project-summary > div { padding: 13px 14px; border-right: 0; }
  .spot-summary-primary { grid-template-columns: 1fr auto; }
  .spot-summary-primary > strong { font-size: 30px; }
  .spot-summary-breakdown { grid-template-columns: repeat(2,minmax(0,1fr)); padding-top: 12px !important; border-top: 1px solid #f3dfd2; }
  .spot-summary-breakdown > div { padding: 7px 10px; border-right: 1px solid #f3dfd2; }
  .spot-summary-breakdown > div:nth-child(2) { border-right: 0; }
  .spot-summary-breakdown > div:nth-child(n+3) { border-top: 1px solid #f3dfd2; }
  .spot-summary-breakdown > div:nth-child(odd) { padding-left: 0; }
  .spot-summary-breakdown > div:nth-child(even) { padding-right: 0; }
  .spot-summary-date { grid-column: auto; }
  .spot-billing-notice { align-items: stretch; flex-direction: column; }
  .spot-billing-notice .button { width: 100%; text-align: center; }
  .spot-time-kpis.compact { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
  .spot-time-kpis.compact > div { padding: 11px 12px; }
  .spot-detail-grid { gap: 12px; }
  .spot-overview-actions { align-items: stretch; flex-direction: column; }
  .spot-overview-actions .button { width: 100%; text-align: center; }
  .project-keyword-search { grid-template-columns: minmax(0,1fr) 62px; }
  .project-keyword-search .button { padding-inline: 10px; }
  .project-filter-fields { grid-template-columns: 1fr; gap: 9px; }
  .project-filter-actions { grid-column: auto; }
  .typed-projects { margin-top: 0; }
}

/* Dashboard overview layout */
.dashboard-layout-v2 { display: grid; grid-template-columns: minmax(0,1.38fr) minmax(420px,1fr); grid-template-rows: auto 193px 193px auto auto; gap: 14px; }
.dashboard-layout-v2 > .dashboard-welcome,.dashboard-layout-v2 > .dashboard-full-schedule,.dashboard-layout-v2 > .dashboard-bottom-stats { grid-column: 1 / -1; }
.dashboard-layout-v2 > .dashboard-deadlines { grid-column: 1; grid-row: 2 / 4; }
.dashboard-layout-v2 > .dashboard-updates { grid-column: 2; grid-row: 2; }
.dashboard-layout-v2 > .customer-summary-panel { grid-column: 2; grid-row: 3; }
.dashboard-welcome { display: grid; grid-template-columns: minmax(260px,.8fr) minmax(540px,1.5fr); gap: 28px; align-items: end; }
.dashboard-welcome h1 { margin: 0; font-size: 28px; }
.dashboard-welcome p { margin: 7px 0 0; color: var(--muted); font-size: 13px; }
.dashboard-quick-area > span { display: block; margin-bottom: 7px; color: var(--muted); font-size: 11px; font-weight: 700; }
.dashboard-quick-area { min-width: 0; }
.dashboard-quick-actions { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; min-width: 0; max-width: 100%; }
.dashboard-quick-button { display: flex; justify-content: center; align-items: center; gap: 8px; min-width: 0; min-height: 42px; padding: 8px 12px; border: 1px solid color-mix(in srgb,var(--type-color) 28%,#fff); border-radius: 7px; background: color-mix(in srgb,var(--type-color) 10%,#fff); color: var(--type-color); font-size: 12px; font-weight: 800; text-align: center; overflow-wrap: anywhere; }
.dashboard-quick-button:hover { border-color: var(--type-color); background: color-mix(in srgb,var(--type-color) 15%,#fff); }
.dashboard-quick-button b { font-size: 21px; line-height: 1; }
.dashboard-layout-v2 > .dashboard-deadlines,.dashboard-layout-v2 > .dashboard-updates,.dashboard-layout-v2 > .customer-summary-panel { min-width: 0; min-height: 0; overflow: hidden; }
.dashboard-layout-v2 .dashboard-project-summaries,.dashboard-layout-v2 .recent-update-list,.dashboard-layout-v2 .mini-company-grid { max-height: calc(100% - 38px); overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; }
.dashboard-layout-v2 .mini-company-grid { grid-template-columns: 1fr; }
.dashboard-layout-v2 .customer-summary-card { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 6px 12px; align-items: center; }
.dashboard-layout-v2 .customer-summary-card p { grid-column: 2; grid-row: 1; display: block; margin: 0; padding: 0; border: 0; text-align: right; }
.dashboard-layout-v2 .customer-summary-card p b { display: block; font-size: 15px; }
.dashboard-layout-v2 .customer-project-counts { grid-column: 1; }
.dashboard-layout-v2 .customer-detail-button { grid-column: 2; min-height: auto; margin: 0; padding: 4px 0; border: 0; color: var(--primary); }
.dashboard-full-schedule { width: 100%; max-width: 100%; min-width: 0; overflow: hidden; box-sizing: border-box; }
.dashboard-schedule-desktop { width: 100%; max-width: 100%; min-width: 0; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: thin; -webkit-overflow-scrolling: touch; }
.dashboard-full-schedule .timeline { min-width: 940px; }
.dashboard-schedule-mobile { display: none; }
.dashboard-bottom-stats { display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); gap: 8px; }
.dashboard-stat-card { display: grid; min-width: 0; min-height: 98px; padding: 14px 16px; border: 1px solid var(--line); border-radius: 8px; background: #fff; color: var(--text); box-shadow: 0 3px 12px rgba(37,54,58,.045); }
.dashboard-stat-card:hover { border-color: var(--primary); }
.dashboard-stat-card > span:not(.type-title-badge) { color: var(--muted); font-size: 11px; }
.dashboard-stat-card > div { display: flex; align-items: baseline; gap: 5px; margin-top: 8px; }
.dashboard-stat-card strong { font-size: 25px; }
.dashboard-stat-card b,.dashboard-stat-card small { color: var(--muted); font-size: 10px; }
.dashboard-stat-card.is-type { justify-items: center; text-align: center; }
.dashboard-stat-card.is-type > div { margin-top: 5px; }
.dashboard-stat-card .type-title-badge { min-height: 21px; padding: 2px 8px; font-size: 9px; }

/* Consistent hover color for ordinary text links */
.main a:not(.button):not(.dashboard-quick-button):not(.kpi-card):not(.dashboard-stat-card):not(.entity-card):not(.type-badge):not(.project-status-badge):hover { color: var(--primary); }
.main a:not(.button):not(.dashboard-quick-button):not(.kpi-card):not(.dashboard-stat-card):not(.entity-card):hover strong { color: var(--primary); }

@media (max-width: 1180px) {
  .dashboard-welcome { grid-template-columns: 1fr; gap: 14px; }
  .dashboard-layout-v2 { grid-template-columns: minmax(0,1.15fr) minmax(360px,1fr); }
  .dashboard-bottom-stats { grid-template-columns: repeat(4,minmax(0,1fr)); }
}

@media (max-width: 900px) {
  .dashboard-layout-v2 { display: flex; flex-direction: column; gap: 14px; }
  .dashboard-welcome { display: grid; }
  .dashboard-welcome { order: 1; }
  .dashboard-deadlines { order: 2; }
  .dashboard-full-schedule { order: 3; }
  .dashboard-updates { order: 4; }
  .customer-summary-panel { order: 5; }
  .dashboard-bottom-stats { order: 6; }
  .dashboard-layout-v2 .mini-company-grid { grid-template-columns: 1fr; }
  .dashboard-layout-v2 > .dashboard-deadlines,.dashboard-layout-v2 > .dashboard-updates,.dashboard-layout-v2 > .customer-summary-panel { overflow: visible; }
  .dashboard-layout-v2 .dashboard-project-summaries,.dashboard-layout-v2 .recent-update-list,.dashboard-layout-v2 .mini-company-grid { max-height: none; overflow: visible; }
  .dashboard-full-schedule { overflow: hidden; }
  .dashboard-schedule-desktop { display: block; overflow-x: auto; }
  .dashboard-full-schedule .timeline { width: 680px; min-width: 680px; }
  .dashboard-schedule-mobile { display: none; }
  .dashboard-bottom-stats { grid-template-columns: repeat(6,minmax(0,1fr)); }
  .dashboard-bottom-stats > .dashboard-stat-card { grid-column: span 3; }
  .dashboard-bottom-stats > .dashboard-stat-card.is-type { grid-column: span 2; }
}

@media (max-width: 560px) {
  .dashboard-welcome h1 { font-size: 24px; }
  .dashboard-quick-area > span { margin-top: 2px; }
  .dashboard-quick-actions { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 5px; overflow: visible; padding-bottom: 0; }
  .dashboard-quick-button { gap: 4px; width: 100%; min-height: 40px; padding: 7px 4px; font-size: 9px; line-height: 1.35; }
  .dashboard-quick-button b { flex: 0 0 auto; font-size: 17px; }
  .dashboard-layout-v2 > .dashboard-deadlines,.dashboard-layout-v2 > .dashboard-updates,.dashboard-layout-v2 > .customer-summary-panel { padding: 15px; }
  .dashboard-deadlines .dashboard-project-summaries > a { grid-template-columns: minmax(0,1fr); gap: 4px; padding: 8px 1px; align-items: start; }
  .dashboard-deadlines .dashboard-project-summary { grid-column: 1; }
  .dashboard-deadlines .dashboard-project-summary strong { display: -webkit-box; overflow: hidden; white-space: normal; line-height: 1.3; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
  .dashboard-deadlines .dashboard-project-summary small { margin-top: 2px; line-height: 1.25; }
  .dashboard-deadlines .summary-badges { justify-content: flex-start; gap: 4px; }
  .dashboard-deadlines .type-badge,.dashboard-deadlines .project-status-badge,.dashboard-deadlines .current-step-badge { padding: 3px 6px; font-size: 9px; }
  .dashboard-bottom-stats { gap: 7px; }
  .dashboard-stat-card { min-height: 82px; padding: 11px 12px; }
  .dashboard-stat-card strong { font-size: 22px; }
}
.field-readonly-note{margin:0;padding:12px 14px;border:1px solid var(--line,#e5e0dc);border-radius:10px;background:#faf8f6;color:var(--muted,#6f6864);line-height:1.6}.field-inline-link{display:block;margin-top:6px;font-size:13px;font-weight:700;color:var(--primary,#2e9d64)}

/* Compact project summary on phones */
@media (max-width: 560px) {
  .project-summary { grid-template-columns: repeat(3,minmax(0,1fr)); height: 56px; margin-bottom: 10px; overflow: hidden; }
  .project-summary > div { display: flex; min-width: 0; padding: 5px 8px; border-right: 1px solid var(--line); border-bottom: 0; flex-direction: column; justify-content: center; }
  .project-summary > div:last-child { border-right: 0; }
  .project-summary > div > span { display: block; margin-bottom: 2px; font-size: 8px; line-height: 1.1; white-space: nowrap; }
  .project-summary > div > strong { display: block; min-width: 0; overflow: hidden; font-size: 10px; line-height: 1.15; text-overflow: ellipsis; white-space: nowrap; }
  .project-summary .category-badge,.project-summary .project-status-badge,.project-summary .pill { display: inline-flex; width: max-content; max-width: 100%; min-height: 18px; margin: 0; padding: 1px 6px; overflow: hidden; font-size: 10px; text-overflow: ellipsis; }
  .project-summary .pill { align-items: center; justify-content: center; border: 0; line-height: 1; }
  .project-summary .status-badges { display: flex; width: max-content; max-width: 100%; margin: 0; gap: 3px; flex-wrap: nowrap; }

  .spot-table { margin-bottom: 16px; padding: 0; background: transparent; border: 0; box-shadow: none; }
  .spot-table .table-wrap { overflow: visible; }
  .spot-table table,.spot-table tbody { display: block; width: 100%; min-width: 0; }
  .spot-table thead { display: none; }
  .spot-table tbody { display: grid; gap: 12px; }
  .spot-table tr { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); padding: 4px 8px 0; overflow: hidden; border: 1px solid var(--line); border-radius: 9px; background: #fff; box-shadow: 0 2px 8px rgba(37,54,58,.05); }
  .spot-table td { display: grid; grid-template-columns: 62px minmax(0,1fr); grid-column: 1 / -1; align-items: start; min-width: 0; padding: 7px 3px; border-bottom: 1px solid var(--line); font-size: 11px; }
  .spot-table td::before { color: var(--muted); font-size: 10px; font-weight: 800; line-height: 1.5; }
  .spot-table td:nth-child(1) { order: 1; }
  .spot-table td:nth-child(1)::before { content: '案件・顧客'; }
  .spot-table td:nth-child(2) { order: 2; }
  .spot-table td:nth-child(2)::before { content: '状況・タスク'; }
  .spot-table td:nth-child(3) { order: 3; }
  .spot-table td:nth-child(3)::before { content: '担当・期限'; }
  .spot-table td:nth-child(4) { order: 4; }
  .spot-table td:nth-child(4)::before { content: '作業時間'; }
  .spot-table td:nth-child(5) { order: 5; }
  .spot-table td:nth-child(5)::before { content: '請求'; }
  .spot-table td:nth-child(3),.spot-table td:nth-child(4),.spot-table td:nth-child(5) { display: block; grid-column: span 2; padding: 9px 3px 11px; border-bottom: 0; text-align: center; }
  .spot-table td:nth-child(3)::before,.spot-table td:nth-child(4)::before,.spot-table td:nth-child(5)::before { display: block; min-height: 16px; margin-bottom: 4px; }
  .spot-table td:nth-child(3) { border-right: 1px solid var(--line); }
  .spot-table td:nth-child(4) { border-right: 1px solid var(--line); }
  .spot-table td:nth-child(n+3) > small { display: block; margin-top: 3px; overflow: hidden; font-size: 9px; line-height: 1.3; text-overflow: ellipsis; white-space: nowrap; }
  .spot-table td > small { grid-column: 2; display: block; margin-top: 3px; overflow: hidden; font-size: 10px; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
  .spot-table td:nth-child(n+3) > small { font-size: 9px; }
  .spot-table td:nth-child(1) .strong-link { font-size: 13px; line-height: 1.45; }
  .spot-table .work-kind-badge,.spot-table .spot-status,.spot-table .billing-status { justify-self: start; max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
  .spot-queue-badges { grid-column: 2; }
  .spot-queue-tasks { grid-column: 2; margin-top: 5px; }
  .spot-queue-tasks > small { flex: 0 0 auto; margin-right: 3px !important; line-height: 20px; }
  .spot-total-hours { font-size: 15px; }
  .spot-queue-summary { margin-inline: -1px; }
  .spot-queue-summary a { min-width: 96px; padding: 9px 10px; }
  .spot-queue-summary a strong { font-size: 16px; }
}

/* Customer directory filters and mobile summary */
.customer-directory-filter-details > summary { display: none; }
.customer-directory-filter-details > .customer-directory-filter { display: grid !important; }
.entity-filter-details > summary { display: none; }
.entity-filter-details > .filter-grid { display: grid !important; }

@media (max-width: 560px) {
  .customer-directory-filter-details { margin-bottom: 10px; border: 1px solid var(--line); border-radius: 9px; background: #fff; }
  .customer-directory-filter-details > summary { display: flex; align-items: center; justify-content: space-between; min-height: 42px; padding: 9px 13px; color: var(--text); font-size: 13px; font-weight: 700; cursor: pointer; list-style: none; }
  .customer-directory-filter-details > summary::-webkit-details-marker { display: none; }
  .customer-directory-filter-details > summary i { width: 8px; height: 8px; border-right: 2px solid var(--muted); border-bottom: 2px solid var(--muted); transform: rotate(45deg); transition: transform .15s ease; }
  .customer-directory-filter-details[open] > summary i { transform: rotate(225deg); }
  .customer-directory-filter-details:not([open]) > .customer-directory-filter { display: none !important; }
  .customer-directory-filter-details > .customer-directory-filter { grid-template-columns: 1fr; gap: 9px; margin: 0; padding: 10px 12px 12px; border-top: 1px solid var(--line); }
  .customer-directory-filter-details .button { width: 100%; margin: 0; }
  .summary-kpis { grid-template-columns: repeat(4,minmax(0,1fr)); gap: 5px; margin-bottom: 12px; }
  .summary-kpis > div { min-width: 0; padding: 8px 5px; text-align: center; }
  .summary-kpis span { overflow: hidden; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
  .summary-kpis strong { margin-top: 3px; font-size: 19px; line-height: 1.1; }
  .entity-filter-details { margin-bottom: 12px; border: 1px solid var(--line); border-radius: 9px; background: #fff; }
  .entity-filter-details > summary { display: flex; align-items: center; justify-content: space-between; min-height: 42px; padding: 9px 13px; color: var(--text); font-size: 13px; font-weight: 700; cursor: pointer; list-style: none; }
  .entity-filter-details > summary::-webkit-details-marker { display: none; }
  .entity-filter-details > summary i { width: 8px; height: 8px; border-right: 2px solid var(--muted); border-bottom: 2px solid var(--muted); transform: rotate(45deg); transition: transform .15s ease; }
  .entity-filter-details[open] > summary i { transform: rotate(225deg); }
  .entity-filter-details:not([open]) > .filter-grid { display: none !important; }
  .entity-filter-details > .filter-grid { grid-template-columns: 1fr; gap: 9px; margin: 0; padding: 10px 12px 12px; border-top: 1px solid var(--line); }
  .entity-filter-details .button { width: 100%; margin: 0; }

  section.panel > form.inline-form:has(+ .step-list) { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
  section.panel > form.inline-form:has(+ .step-list) > input[name="name"] { grid-column: 1; grid-row: 1; }
  section.panel > form.inline-form:has(+ .step-list) > input[name="assignee"] { grid-column: 2; grid-row: 1; }
  section.panel > form.inline-form:has(+ .step-list) > .date-picker-field-start_date { grid-column: 1; grid-row: 2; }
  section.panel > form.inline-form:has(+ .step-list) > .date-picker-field-end_date { grid-column: 2; grid-row: 2; }
  section.panel > form.inline-form:has(+ .step-list) > .button { grid-column: 1 / -1; grid-row: 3; justify-self: start; margin: 0; }
  section.panel > form.inline-form:has(+ .step-list) > input,section.panel > form.inline-form:has(+ .step-list) > .date-picker-shell { width: 100%; min-width: 0; }
  section.panel > form.inline-form:has(+ .step-list) > .date-picker-shell input { width: 100%; min-width: 0; max-width: 100%; }
  .step-list { gap: 7px; }
  .step-list form { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 6px 8px; padding: 7px; border-radius: 9px; }
  .step-list form > .step-drag-handle { grid-column: 1; grid-row: 1; align-self: stretch; }
  .step-list form > input[name="name"] { grid-column: 2; grid-row: 1; min-height: 38px; }
  .step-list form > input[name="assignee"] { grid-column: 1; grid-row: 2; }
  .step-list form > select[name="status"] { grid-column: 2; grid-row: 2; }
  .step-list form > .date-picker-field-start_date { grid-column: 1; grid-row: 3; }
  .step-list form > .date-picker-field-end_date { grid-column: 2; grid-row: 3; }
  .step-list form > .step-card-actions { display: contents; }
  .step-list form > .step-card-actions .step-schedule-check { grid-column: 1 / -1; grid-row: 4; justify-self: end; min-height: 23px; padding: 2px 5px; border: 0; background: transparent; font-size: 10px; }
  .step-list form > .step-card-actions .step-log-link { grid-column: 1; grid-row: 4; justify-self: start; min-height: 27px; margin: 0; }
  .step-list form > .step-card-actions .step-log-link { width: auto; min-width: 84px; padding-inline: 8px; }
  .step-log-label-desktop { display: none; }
  .step-log-label-mobile { display: inline; }
  .step-list form > .step-card-actions button.button { grid-column: 1 / -1; grid-row: 5; width: 100%; min-height: 32px; margin: 0; font-size: 13px; }
  .step-list form > input,.step-list form > select,.step-list form > .date-picker-shell { width: 100%; min-width: 0; }
  .step-list form > input,.step-list form > select { min-height: 32px; padding-block: 5px; }
  .step-list form > .date-picker-shell input { width: 100%; min-width: 0; max-width: 100%; }
  .work-log-filter { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .work-log-filter select,.work-log-filter .button { grid-column: 1 / -1; }
  .work-log-detail-grid { grid-template-columns: 1fr; }
  .work-log header,.work-log footer { align-items: flex-start; flex-direction: column; }
}
.maintenance-report-command-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.maintenance-report-command-actions .maintenance-log-add-disclosure{margin-top:0}.maintenance-txt-preview{margin-top:14px;padding:16px;border:1px solid #75b74f;border-radius:10px;background:#f4faef}.maintenance-txt-preview-heading,.maintenance-txt-preview-actions{display:flex;align-items:center;justify-content:space-between;gap:14px}.maintenance-txt-preview-heading p,.maintenance-txt-preview-actions p{margin:4px 0 0;color:#516248}.maintenance-txt-match-list{display:grid;gap:8px;margin:14px 0}.maintenance-txt-match{display:grid;grid-template-columns:minmax(140px,1fr) auto minmax(180px,1fr) minmax(280px,1.5fr);align-items:center;gap:12px;padding:12px;border:1px solid #a5ca8c;border-radius:8px;background:#fff}.maintenance-txt-match small{display:block;color:#60705a}.maintenance-txt-match p{margin:0;color:#364331}.maintenance-txt-match.is-unmatched{border-color:#e78b76;background:#fff5f1}.maintenance-txt-preview-actions{padding-top:12px;border-top:1px solid #bdd5ab}.maintenance-txt-preview-actions form{margin-left:auto}@media(max-width:900px){.maintenance-txt-match{grid-template-columns:1fr auto 1fr}.maintenance-txt-match p{grid-column:1/-1}.maintenance-txt-preview-actions{align-items:flex-start;flex-wrap:wrap}.maintenance-txt-preview-actions form{margin-left:0}}
.maintenance-txt-preview{border-color:var(--maintenance-border-strong);background:var(--maintenance-surface)}.maintenance-txt-preview-heading p,.maintenance-txt-preview-actions p,.maintenance-txt-match small{color:var(--maintenance-text)}.maintenance-txt-match{border-color:var(--maintenance-border)}.maintenance-txt-match p{color:#26312c}.maintenance-txt-preview-actions{border-top-color:var(--maintenance-border)}