/* Bootstrap shell — ヒラクモ UI Design Guideline */
:root {
  --hirakumo-brand: #4CBBB4;
  --hirakumo-brand-hover: #3AA99C;
  --hirakumo-brand-active: #0086A0;
  --hirakumo-accent2: #0086A0;
  --hirakumo-employee: #0086A0;
  --hirakumo-facility: #2CAFA7;
  --hirakumo-emphasis: #E8A32D;
  --hirakumo-emphasis-hover: #D49A1A;
  --hirakumo-required: #B81C22;
  --hirakumo-danger: #B81C22;
  --hirakumo-danger-hover: #9A171C;
  --hirakumo-disabled: #B9B9B9;
  --hirakumo-info: #A8DCE1;
  --hirakumo-ink: #333333;
  --bs-body-color: #333333;
  --bs-heading-color: #333333;
  --bs-emphasis-color: #333333;
  --hirakumo-muted: #666666;
  --hirakumo-border: #CCCCCC;
  --hirakumo-focus-fill: #E6F7F5;
  --hirakumo-outline-hover: #E6F7F5;
  --hirakumo-outline-emphasis-hover: #FFF7EB;

  /* Evaluation role tags (従業員 / 上司1 / 上司2 / 上司3) */
  --hirakumo-role-employee: var(--hirakumo-employee);
  --hirakumo-role-manager1: #666666;
  --hirakumo-role-manager2: #4CBBB4;
  --hirakumo-role-manager3: #E8A32D;

  /* Typography (PC) — customer page 02 */
  --type-title: 32px;       /* タイトル Bold */
  --type-heading: 24px;     /* 見出し Bold */
  --type-heading-md: 20px;  /* 中見出し Bold */
  --type-heading-sm: 18px;  /* 小見出し Bold */
  --type-body: 16px;        /* 本文 Regular */
  --type-other: 14px;       /* その他 Regular */
  --type-caption: 12px;     /* キャプション Regular */
  --type-weight-bold: 700;
  --type-weight-regular: 400;

  /* Spacing (PC) — page 03 */
  --space-section-same: 160px;
  --space-section-change: 100px;
  --space-title-lg-content: 64px;
  --space-title-md-content: 48px;
  --space-title1-title2: 48px;
  --space-title2-title3: 24px;
  --space-title3-body: 16px;
  --space-btn-stack: 16px;
  --space-btn-row: 32px;
  --space-link-icon: 16px;

  --bs-primary: #4CBBB4;
  --bs-primary-rgb: 76, 187, 180;
  --bs-success: #4CBBB4;
  --bs-success-rgb: 76, 187, 180;
  --bs-warning: #E8A32D;
  --bs-warning-rgb: 232, 163, 45;
  --bs-danger: #B81C22;
  --bs-danger-rgb: 184, 28, 34;
  --bs-link-color: #4CBBB4;
  --bs-link-hover-color: #3AA99C;
  --shell-brand: #4CBBB4;
  --shell-sidebar-bg: #4CBBB4;
  --shell-sidebar-width: 200px;
  --shell-sidebar-mini-width: 3.5rem;

  /* Button SIZE — page 04 (14px Bold; stays 14px on SP, not --type-other) */
  --shell-btn-radius: 8px;
  --shell-input-radius: 6px;
  --bs-border-radius: 6px;
  --bs-border-radius-sm: 4px;
  --bs-border-radius-lg: 8px;
  --shell-btn-font-weight: var(--type-weight-bold);
  --shell-btn-font-size: 14px;
  --shell-btn-padding-y: 13px;
  --shell-btn-padding-x: 16px;
  --shell-btn-min-height: 45px;
  --shell-btn-letter-spacing: 0.3px;
  --shell-btn-line-height: 1.5;
  /* 日本語: Noto Sans JP / 英数: Montserrat (JP glyphs fall through) */
  --shell-font: "Montserrat", "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  --shell-font-en: "Montserrat", "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  --shell-page-bg: #f3f4f6;
  accent-color: #4CBBB4;
}

@media (max-width: 991.98px) {
  :root {
    --type-title: 28px;
    --type-heading: 21px;
    --type-heading-md: 18px;
    --type-heading-sm: 16px;
    --type-body: 14px;
    --type-other: 12px;
    --type-caption: 10px;
    /* Margin page 03 — SP */
    --space-section-same: 120px;
    --space-section-change: 64px;
    --space-title1-title2: 40px;
    --shell-btn-min-height: 38px;
    --shell-btn-padding-y: 8px;
  }
}

body,
#app-screen {
  font-family: var(--shell-font);
  font-size: var(--type-body);
  font-weight: var(--type-weight-regular);
  color: var(--hirakumo-ink);
  background: var(--shell-page-bg);
}

/* Customer type scale — map Bootstrap headings to タイトル〜小見出し */
h1, .h1 {
  font-size: var(--type-title);
  font-weight: var(--type-weight-bold);
  line-height: 1.35;
  color: var(--hirakumo-ink);
}
h2, .h2 {
  font-size: var(--type-heading);
  font-weight: var(--type-weight-bold);
  line-height: 1.35;
  color: var(--hirakumo-ink);
}
h3, .h3 {
  font-size: var(--type-heading-md);
  font-weight: var(--type-weight-bold);
  line-height: 1.35;
  color: var(--hirakumo-ink);
}
h4, .h4,
h5, .h5 {
  font-size: var(--type-heading-sm);
  font-weight: var(--type-weight-bold);
  line-height: 1.35;
  color: var(--hirakumo-ink);
}
h6, .h6 {
  font-size: var(--type-other);
  font-weight: var(--type-weight-bold);
  line-height: 1.4;
  color: var(--hirakumo-ink);
}

/* Unify buttons site-wide: size, radius, weight, family */
.btn,
.btn-sm,
.btn-lg {
  --bs-btn-border-radius: var(--shell-btn-radius);
  --bs-btn-font-weight: var(--shell-btn-font-weight);
  --bs-btn-font-size: var(--shell-btn-font-size);
  --bs-btn-padding-y: var(--shell-btn-padding-y);
  --bs-btn-padding-x: var(--shell-btn-padding-x);
  --bs-btn-line-height: var(--shell-btn-line-height);
  border-radius: var(--shell-btn-radius) !important;
  font-weight: var(--shell-btn-font-weight) !important;
  font-size: var(--shell-btn-font-size) !important;
  line-height: var(--shell-btn-line-height) !important;
  padding: var(--shell-btn-padding-y) var(--shell-btn-padding-x) !important;
  min-height: var(--shell-btn-min-height);
  font-family: var(--shell-font) !important;
  letter-spacing: var(--shell-btn-letter-spacing);
  transition: 0.3s linear;
}

/* Compact buttons in tables */
.btn-sm,
.table .btn,
.table .btn-sm {
  min-height: 32px;
  padding-top: 4px !important;
  padding-bottom: 4px !important;
}

/* 一覧 action links must not inflate shared list-table row height */
.list-table .btn-link,
.list-table .btn-link.btn-sm,
.dash-card > .table-responsive > .table .btn-link,
.dash-card > .table-responsive > .table .btn-link.btn-sm {
  min-height: 0 !important;
  height: auto !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  line-height: 1.35 !important;
  vertical-align: baseline;
}

/* 通常・進行 — teal solid (hover: same fill + brightness) */
.btn-primary,
.btn-success {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--hirakumo-brand);
  --bs-btn-border-color: var(--hirakumo-brand);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--hirakumo-brand);
  --bs-btn-hover-border-color: var(--hirakumo-brand);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--hirakumo-brand);
  --bs-btn-active-border-color: var(--hirakumo-brand);
  --bs-btn-disabled-bg: var(--hirakumo-disabled);
  --bs-btn-disabled-border-color: var(--hirakumo-disabled);
  --bs-btn-disabled-color: #fff;
}

/* 強調・進行サブ — yellow solid */
.btn-warning {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--hirakumo-emphasis);
  --bs-btn-border-color: var(--hirakumo-emphasis);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--hirakumo-emphasis);
  --bs-btn-hover-border-color: var(--hirakumo-emphasis);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--hirakumo-emphasis);
  --bs-btn-active-border-color: var(--hirakumo-emphasis);
  --bs-btn-disabled-bg: var(--hirakumo-disabled);
  --bs-btn-disabled-border-color: var(--hirakumo-disabled);
  --bs-btn-disabled-color: #fff;
}

.btn-danger {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--hirakumo-danger);
  --bs-btn-border-color: var(--hirakumo-danger);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--hirakumo-danger);
  --bs-btn-hover-border-color: var(--hirakumo-danger);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--hirakumo-danger);
  --bs-btn-active-border-color: var(--hirakumo-danger);
  --bs-btn-disabled-bg: var(--hirakumo-disabled);
  --bs-btn-disabled-border-color: var(--hirakumo-disabled);
  --bs-btn-disabled-color: #fff;
}

.btn-primary:hover,
.btn-primary:active,
.btn-success:hover,
.btn-success:active,
.btn-warning:hover,
.btn-warning:active,
.btn-danger:hover,
.btn-danger:active {
  filter: brightness(0.7);
}
.btn-primary:disabled,
.btn-primary.disabled,
.btn-success:disabled,
.btn-success.disabled,
.btn-warning:disabled,
.btn-warning.disabled,
.btn-danger:disabled,
.btn-danger.disabled {
  filter: none;
}

/* アウトラインサブ — white bg, teal border+text; hover light teal fill (no brightness) */
.btn-outline-primary {
  --bs-btn-color: var(--hirakumo-brand);
  --bs-btn-bg: #fff;
  --bs-btn-border-color: var(--hirakumo-brand);
  --bs-btn-hover-color: var(--hirakumo-brand);
  --bs-btn-hover-bg: var(--hirakumo-outline-hover);
  --bs-btn-hover-border-color: var(--hirakumo-brand);
  --bs-btn-active-color: var(--hirakumo-brand);
  --bs-btn-active-bg: var(--hirakumo-outline-hover);
  --bs-btn-active-border-color: var(--hirakumo-brand);
  --bs-btn-disabled-color: var(--hirakumo-disabled);
  --bs-btn-disabled-bg: #fff;
  --bs-btn-disabled-border-color: var(--hirakumo-disabled);
}
.btn-outline-primary:hover,
.btn-outline-primary:active {
  filter: none;
}

.btn-outline-warning {
  --bs-btn-color: var(--hirakumo-emphasis);
  --bs-btn-bg: #fff;
  --bs-btn-border-color: var(--hirakumo-emphasis);
  --bs-btn-hover-color: var(--hirakumo-emphasis);
  --bs-btn-hover-bg: var(--hirakumo-outline-emphasis-hover);
  --bs-btn-hover-border-color: var(--hirakumo-emphasis);
  --bs-btn-active-color: var(--hirakumo-emphasis);
  --bs-btn-active-bg: var(--hirakumo-outline-emphasis-hover);
  --bs-btn-active-border-color: var(--hirakumo-emphasis);
  --bs-btn-disabled-color: var(--hirakumo-disabled);
  --bs-btn-disabled-bg: #fff;
  --bs-btn-disabled-border-color: var(--hirakumo-disabled);
}
.btn-outline-warning:hover,
.btn-outline-warning:active {
  filter: none;
}

.btn-outline-secondary {
  --bs-btn-color: #4b5563;
  --bs-btn-border-color: #d1d5db;
  --bs-btn-hover-color: #333;
  --bs-btn-hover-bg: #f3f4f6;
  --bs-btn-hover-border-color: #9ca3af;
  --bs-btn-active-color: #333;
  --bs-btn-active-bg: #e5e7eb;
  --bs-btn-active-border-color: #9ca3af;
}

.btn-outline-danger {
  --bs-btn-color: var(--hirakumo-danger);
  --bs-btn-bg: #fff;
  --bs-btn-border-color: var(--hirakumo-danger);
  --bs-btn-hover-color: var(--hirakumo-danger);
  --bs-btn-hover-bg: #FDECEC;
  --bs-btn-hover-border-color: var(--hirakumo-danger);
  --bs-btn-active-color: var(--hirakumo-danger);
  --bs-btn-active-bg: #FDECEC;
  --bs-btn-active-border-color: var(--hirakumo-danger);
  --bs-btn-disabled-color: var(--hirakumo-disabled);
  --bs-btn-disabled-bg: #fff;
  --bs-btn-disabled-border-color: var(--hirakumo-disabled);
}
.btn-outline-danger:hover,
.btn-outline-danger:active {
  filter: none;
}

/* Text/link actions — page 04 */
.btn-link {
  font-family: var(--shell-font) !important;
  font-weight: var(--shell-btn-font-weight) !important;
  font-size: var(--shell-btn-font-size) !important;
  padding: 0.15rem 0.25rem !important;
  border-radius: var(--shell-btn-radius) !important;
  color: var(--hirakumo-brand);
  text-decoration: none;
  transition: 0.3s linear;
  min-height: 0;
}
.btn-link:hover,
.btn-link:focus,
.btn-link:active {
  color: var(--hirakumo-brand);
  text-decoration: none;
  filter: brightness(0.7);
}
.btn-link.text-danger,
a.btn-link.text-danger {
  color: var(--hirakumo-danger) !important;
}
.btn-link.text-danger:hover,
.btn-link.text-danger:focus,
.btn-link.text-danger:active,
a.btn-link.text-danger:hover,
a.btn-link.text-danger:focus,
a.btn-link.text-danger:active {
  color: var(--hirakumo-danger-hover) !important;
  filter: brightness(0.85);
}
.btn-link:disabled,
.btn-link.disabled {
  filter: none;
}

/* Required field badge (必須) — danger red #B81C22 */
.badge.text-bg-danger {
  --bs-bg-opacity: 1;
  background-color: var(--hirakumo-required) !important;
  color: #fff !important;
  font-weight: 400 !important;
  letter-spacing: 0.02em;
}
span.req,
.nf-label .req {
  display: inline-block;
  margin-left: 0.35rem;
  padding: 0.2em 0.45em;
  border-radius: 0.25rem;
  background-color: var(--hirakumo-required);
  color: #fff;
  font-size: 0.75em;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0.02em;
  vertical-align: middle;
}

a {
  color: var(--bs-link-color);
  text-decoration: none;
  transition: 0.3s linear;
}
a:hover {
  color: var(--bs-link-color);
  filter: brightness(0.7);
}
/* Keep shell chrome free of global link brightness */
.sidebar a:hover,
.navbar a:hover,
.topbar a:hover,
.dropdown-menu a:hover,
.nav-tabs a:hover,
.nav-tabs .nav-link:hover,
.pagination a:hover,
.pagination .page-link:hover {
  filter: none;
}

.text-primary { color: var(--hirakumo-brand) !important; }
.bg-primary { background-color: var(--hirakumo-brand) !important; }
.text-success { color: var(--hirakumo-brand) !important; }
.bg-success { background-color: var(--hirakumo-brand) !important; }
a.text-primary,
a.link-primary,
.link-primary {
  color: var(--hirakumo-brand) !important;
}
a.text-primary:hover,
a.link-primary:hover,
.link-primary:hover {
  color: var(--hirakumo-brand-hover) !important;
}

/* Form — page 05 */
.form-check-input {
  width: 18px;
  height: 18px;
  margin-top: 0.15em;
}
.form-check-input:checked {
  background-color: var(--hirakumo-brand);
  border-color: var(--hirakumo-brand);
}
.form-check-input:focus {
  border-color: var(--hirakumo-brand);
  box-shadow: 0 0 0 0.25rem rgba(76, 187, 180, 0.25);
}

/* Rounded inputs (Bootstrap form-control / form-select) */
.form-control,
.form-select,
.form-control-sm,
.form-select-sm,
.input-group > .form-control,
.input-group > .form-select {
  border-radius: var(--shell-input-radius) !important;
  min-height: 2.5rem;
  padding-top: 0.55rem;
  padding-bottom: 0.55rem;
  font-family: var(--shell-font);
  font-size: var(--type-body);
  line-height: 1.45;
  background-clip: padding-box;
}
/* Chrome autofill keeps the UA font until focus unless it is set on the field itself. */
input.form-control:-webkit-autofill,
input.form-control:-webkit-autofill:hover,
input.form-control:-webkit-autofill:focus,
input.form-control:-webkit-autofill:active,
textarea.form-control:-webkit-autofill,
select.form-select:-webkit-autofill {
  font-family: var(--shell-font) !important;
  -webkit-text-fill-color: var(--hirakumo-ink);
}
input.form-control:-webkit-autofill::first-line,
textarea.form-control:-webkit-autofill::first-line {
  font-family: "Montserrat", "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  font-size: var(--type-body);
}
/* Native Windows/WebKit fields paint a square inner fill; strip it so radius + focus ring match. */
.form-control:not([type="file"]):not([type="checkbox"]):not([type="radio"]):not([type="date"]):not([type="time"]):not([type="datetime-local"]):not([type="month"]):not([type="week"]),
.form-select {
  appearance: none;
  -webkit-appearance: none;
}
.form-control-sm,
.form-select-sm {
  min-height: 2.5rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  font-size: var(--type-body);
}

/* Form labels: same size as input text (override Bootstrap .small / compact eval labels) */
label.form-label,
label.col-form-label,
label.col-form-label.small,
label.form-label.small,
.form-check-label,
.nf-label,
.eval-period-meta-label,
.eval-assign-role-label,
.eval-column-editor-field > label {
  font-size: var(--type-body) !important;
  line-height: 1.45;
}
textarea.form-control,
textarea.form-control-sm {
  min-height: 6.5rem;
  padding-top: 0.65rem;
  padding-bottom: 0.65rem;
}
/* File input: make 「ファイルを選択」 fill full control height */
input[type="file"].form-control,
input[type="file"].form-control-sm {
  padding-top: 0;
  padding-bottom: 0;
  padding-left: 0;
  padding-right: 0.85rem;
  line-height: 1.25;
  overflow: hidden;
}
input[type="file"].form-control::file-selector-button,
input[type="file"].form-control-sm::file-selector-button {
  box-sizing: border-box;
  height: 2.5rem;
  margin: 0;
  margin-inline-end: 0.75rem;
  padding: 0 0.95rem;
  border: 0;
  border-inline-end: 1px solid #ced4da;
  border-radius: 0;
  background-color: #e9ecef;
  color: #495057;
  font-weight: 600;
  font-size: inherit;
  line-height: 2.5rem;
}
input[type="file"].form-control-sm {
  min-height: 2.5rem;
}
input[type="file"].form-control-sm::file-selector-button {
  height: 2.5rem;
  line-height: 2.5rem;
  padding: 0 0.85rem;
}
.form-control:focus,
.form-select:focus,
.form-control:focus-visible,
.form-select:focus-visible {
  border-color: var(--hirakumo-brand);
  background-color: var(--hirakumo-focus-fill);
  outline: none !important;
  border-radius: var(--shell-input-radius) !important;
  box-shadow: 0 0 0 0.25rem rgba(76, 187, 180, 0.25);
}
.form-control.is-invalid,
.form-select.is-invalid,
.was-validated .form-control:invalid,
.was-validated .form-select:invalid {
  border-color: var(--hirakumo-danger);
}
.form-control.is-invalid:focus,
.form-select.is-invalid:focus,
.was-validated .form-control:invalid:focus,
.was-validated .form-select:invalid:focus {
  border-color: var(--hirakumo-danger);
  box-shadow: 0 0 0 0.25rem rgba(237, 91, 82, 0.25);
}
.input-group {
  overflow: visible;
}

/* Title / type utilities — customer page 02 */
.hira-title,
.hira-title-1 {
  font-size: var(--type-title);
  font-weight: var(--type-weight-bold);
  border-bottom: 2px solid var(--hirakumo-brand);
  padding-bottom: 0.25rem;
  color: var(--hirakumo-ink);
}
.hira-heading {
  font-size: var(--type-heading);
  font-weight: var(--type-weight-bold);
  color: var(--hirakumo-ink);
}
.hira-heading-md,
.hira-title-2 {
  font-size: var(--type-heading-md);
  font-weight: var(--type-weight-bold);
  background: var(--hirakumo-focus-fill, #E6F7F5);
  display: inline-block;
  padding: 0.2em 0.5em;
  color: var(--hirakumo-ink);
}
.hira-heading-sm,
.hira-title-3 {
  font-size: var(--type-heading-sm);
  font-weight: var(--type-weight-bold);
  border-left: 3px solid var(--hirakumo-brand);
  padding-left: 0.5rem;
  color: var(--hirakumo-ink);
}
.hira-body {
  font-size: var(--type-body);
  font-weight: var(--type-weight-regular);
  color: var(--hirakumo-ink);
}
.hira-other {
  font-size: var(--type-other);
  font-weight: var(--type-weight-regular);
  color: var(--hirakumo-ink);
}
.hira-caption {
  font-size: var(--type-caption);
  font-weight: var(--type-weight-regular);
  color: var(--hirakumo-muted);
}
.hira-stack-title {
  margin-bottom: var(--space-title1-title2);
}
.hira-stack-title-md {
  margin-bottom: var(--space-title2-title3);
}
.hira-stack-title-sm {
  margin-bottom: var(--space-title3-body);
}
/* Margin page 03 — section gaps & title→content */
.hira-section-same {
  margin-top: var(--space-section-same);
}
.hira-section-change {
  margin-top: var(--space-section-change);
  margin-bottom: var(--space-section-change);
}
.hira-title-content-lg {
  margin-bottom: var(--space-title-lg-content);
}
.hira-title-content-md {
  margin-bottom: var(--space-title-md-content);
}

/* ===== Shell layout ===== */
#app-screen {
  display: flex !important;
  height: 100vh;
  height: 100dvh;
  max-height: 100vh;
  max-height: 100dvh;
  min-height: 0;
  overflow: hidden;
  background: var(--shell-page-bg);
}

.sidebar {
  width: var(--shell-sidebar-width);
  min-width: 0;
  min-height: 0 !important;
  height: 100vh;
  height: 100dvh;
  max-height: 100vh;
  max-height: 100dvh;
  background: var(--shell-sidebar-bg) !important;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.sidebar-brand {
  height: auto;
  min-height: 0;
  max-height: none;
  padding: 0.4rem 0.55rem 0.3rem !important;
  flex-shrink: 0;
  min-width: 0;
  box-sizing: border-box;
  /* Accent 800 — white logo sits on the brand teal field */
  background: #4cbbb4;
  border-bottom: 1px solid rgba(255, 255, 255, 0.22) !important;
  align-items: flex-end !important;
  cursor: pointer;
}
.sidebar-brand:focus-visible {
  outline: 2px solid rgba(255, 255, 255, 0.65);
  outline-offset: -2px;
}

.sidebar-brand > div:last-child {
  min-width: 0;
  flex: 1 1 auto;
}

.sidebar-brand-logo {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  max-height: 52px;
  flex: 0 0 auto;
  object-fit: contain;
  object-position: left bottom;
  border-radius: 0;
  background: transparent;
  padding: 0;
  box-shadow: none !important;
  filter: none;
}
.sidebar-brand-logo--sm {
  width: auto;
  max-width: 14rem;
  height: 36px;
  max-height: 36px;
  border-radius: 0;
  background: transparent;
  padding: 0;
  object-position: left bottom;
}
.mobile-topnav-logo {
  width: auto;
  max-width: 9.5rem;
  height: 36px;
  object-fit: contain;
  object-position: left center;
  border-radius: 8px;
  background: transparent;
  padding: 2px 4px;
}

.brand-name {
  font-size: 13px;
  font-weight: 700;
  line-height: 1.3;
  color: #fff;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  word-break: break-word;
}
.brand-display {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans JP", sans-serif;
  font-weight: 600;
  color: #fff !important;
  letter-spacing: 0.01em;
  line-height: 1.15;
  white-space: nowrap;
  overflow: visible;
  display: block;
  -webkit-line-clamp: unset;
}
.sidebar-brand .brand-display,
.offcanvas-header .brand-display {
  font-size: 1.2rem;
}
.brand-display--nav {
  font-size: 1.15rem;
}
.brand-sub {
  font-size: 12px;
  font-weight: 500;
  opacity: 0.92;
  margin-top: 2px;
  color: #fff;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Full-width menu rows; active = darker green bar like screenshot */
.sidebar .sidebar-nav {
  padding-left: 0 !important;
  padding-right: 0 !important;
  gap: 0 !important;
  min-width: 0;
}
.sidebar .nav-link {
  font-size: 14px;
  font-weight: 500;
  border-radius: 0 !important;
  white-space: nowrap;
  padding: 0.55rem 0.7rem;
  color: #fff !important;
  -webkit-text-stroke: 0;
  text-shadow: none;
  max-width: 100%;
  min-width: 0;
  overflow: hidden;
}
.sidebar .nav-link > span:not(.nav-icon):not(.sidebar-chevron) {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sidebar .nav-link:hover {
  background: rgba(0, 0, 0, 0.12);
  color: #fff !important;
}
.sidebar .nav-link.active,
.sidebar .nav-pills .nav-link.active {
  background: #2086A0 !important;
  color: #fff !important;
  font-weight: 600;
}
.sidebar .nav-icon {
  width: 1.4rem;
  text-align: center;
  flex-shrink: 0;
  font-size: 1.05rem;
  line-height: 1;
  filter: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.sidebar .nav-icon .app-icon,
.sidebar .nav-icon.app-icon,
.sidebar .app-icon.nav-icon {
  width: 1.15rem;
  height: 1.15rem;
  object-fit: contain;
  display: block;
}
.sidebar .nav-icon-img {
  width: 18px;
  height: 18px;
  object-fit: contain;
  border-radius: 3px;
  box-shadow: none !important;
  filter: none;
  flex-shrink: 0;
}
.app-icon {
  width: 1.25rem;
  height: 1.25rem;
  object-fit: contain;
  flex-shrink: 0;
  vertical-align: middle;
}
.card-icon .app-icon,
.card-icon.app-icon {
  width: 1.15rem;
  height: 1.15rem;
}
.dash-quick-tile .card-icon .app-icon,
.dash-quick .card-icon .app-icon {
  width: 1.35rem;
  height: 1.35rem;
}
.cm-policy-tabs .nav-link .card-icon .app-icon,
.cm-policy-tabs .nav-link .app-icon {
  width: 1rem;
  height: 1rem;
}
.sidebar .sidebar-section-label {
  padding: 0.45rem 0.75rem 0.25rem;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: #fff;
  -webkit-text-stroke: 0;
  text-shadow:
    0 0 1px #e5e7eb,
    0 0 1px #e5e7eb;
}

/* Child menus (クイックメニュー / マスタ管理) */
.sidebar-submenu { display: none; min-width: 0; max-width: 100%; }
.sidebar-submenu.is-open { display: block; }
.sidebar .sidebar-toggle .sidebar-chevron {
  transition: transform 0.15s ease;
  display: inline-block;
  flex-shrink: 0;
}
.sidebar .sidebar-toggle[aria-expanded="true"] .sidebar-chevron,
.sidebar .sidebar-toggle.is-open .sidebar-chevron {
  transform: rotate(180deg);
}
.sidebar .sidebar-subnav {
  margin: 0.2rem 0 0.45rem;
  gap: 0 !important;
  padding-left: 0 !important;
  min-width: 0;
  max-width: 100%;
}
.sidebar .sidebar-subnav .nav-link {
  padding: 0.55rem 0.75rem 0.55rem 2.1rem !important;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.4;
}

/* Mobile top bar + Bootstrap offcanvas-lg sidebar */
.mobile-topnav {
  background: var(--shell-sidebar-bg) !important;
  z-index: 1040;
}
.mobile-topnav .navbar-toggler:focus {
  box-shadow: none;
}

/* Below lg: sidebar is an offcanvas drawer */
@media (max-width: 991.98px) {
  #app-screen {
    flex-direction: column;
    height: 100vh;
    height: 100dvh;
    overflow: hidden;
  }
  #app-screen > .sidebar.offcanvas-lg {
    --bs-offcanvas-width: 50vw;
    width: 50vw !important;
    max-width: 50vw !important;
    background: var(--shell-sidebar-bg) !important;
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
  }
  #app-screen > .sidebar.offcanvas-lg.show,
  #app-screen > .sidebar.offcanvas-lg.showing {
    box-shadow: -4px 0 18px rgba(0, 0, 0, 0.18);
  }
  /* Dimmed page area: tap to close mobile sidemenu */
  body > .offcanvas-backdrop {
    z-index: 1040;
  }
  #app-screen > .sidebar.offcanvas-lg .offcanvas-body {
    background: transparent !important;
    display: flex !important;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    min-width: 0;
    overflow-x: hidden;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
  }
  #app-screen > .sidebar.offcanvas-lg .sidebar-nav {
    flex: 1 1 auto !important;
    min-height: 0;
    overflow: visible !important;
  }
  .layout-col {
    width: 100%;
    min-width: 0;
    min-height: 0;
    flex: 1 1 0%;
    overflow: hidden;
  }
  .topbar {
    padding: 0 12px;
  }
  .topbar-title {
    font-size: 16px;
  }

  .main-content {
    padding: 0 12px;
    --main-content-pad-x: 12px;
  }
  .main-content > .page {
    padding-top: 12px;
    padding-bottom: 12px;
  }
  .page-content {
    max-width: 100%;
    overflow-x: auto;
  }
  .jm-grid-wrap,
  .table-responsive,
  .dash-card .table-responsive {
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .bs-modal-overlay {
    padding: 0.5rem;
    align-items: flex-start;
  }
  .bs-modal-overlay .modal-dialog {
    margin: 0.5rem auto;
    max-width: calc(100vw - 1rem) !important;
  }
  .bs-modal-overlay .modal-dialog.modal-lg,
  .bs-modal-overlay .modal-dialog.modal-xl,
  .bs-modal-overlay .modal-dialog.sch-detail-dialog {
    --bs-modal-width: calc(100vw - 1rem);
    max-width: calc(100vw - 1rem) !important;
  }
  /* dvh = area above the phone browser toolbar, so 保存 stays reachable */
  .bs-modal-overlay .modal-content,
  .bs-modal-overlay .modal-content.sch-form-modal,
  .bs-modal-overlay .modal-dialog.modal-xl .modal-content {
    max-height: calc(100dvh - 2rem) !important;
  }
  .bs-modal-overlay .modal-content.sch-form-modal {
    min-height: 0 !important;
  }
  .jm-dt-row {
    flex-wrap: wrap;
  }
}

/* lg+: fixed green sidebar — scroll the whole menu panel (works with open submenus) */
@media (min-width: 992px) {
  #app-screen > .sidebar.offcanvas-lg {
    position: sticky !important;
    top: 0 !important;
    align-self: flex-start !important;
    z-index: auto;
    flex: 0 0 var(--shell-sidebar-width) !important;
    width: var(--shell-sidebar-width) !important;
    max-width: var(--shell-sidebar-width) !important;
    min-height: 0 !important;
    height: 100vh !important;
    height: 100dvh !important;
    max-height: 100vh !important;
    max-height: 100dvh !important;
    visibility: visible !important;
    transform: none !important;
    background: var(--shell-sidebar-bg) !important;
    border: none !important;
    box-shadow: none;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
  }
  #app-screen > .sidebar.offcanvas-lg .offcanvas-body {
    /* Single scroll container: brand + full nav (incl. open children) */
    display: block !important;
    flex: 1 1 auto !important;
    width: 100%;
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
    min-width: 0;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    padding: 0 !important;
    background: transparent !important;
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, 0.7) rgba(0, 0, 0, 0.18);
  }
  #app-screen > .sidebar.offcanvas-lg .offcanvas-body::-webkit-scrollbar {
    width: 8px;
  }
  #app-screen > .sidebar.offcanvas-lg .offcanvas-body::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.55);
    border-radius: 999px;
  }
  #app-screen > .sidebar.offcanvas-lg .offcanvas-body::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 255, 255, 0.8);
  }
  #app-screen > .sidebar.offcanvas-lg .offcanvas-body::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.15);
  }
  #app-screen > .sidebar.offcanvas-lg .sidebar-brand {
    position: sticky;
    top: 0;
    z-index: 2;
    background: #4cbbb4 !important;
  }
  #app-screen > .sidebar.offcanvas-lg .sidebar-nav {
    display: flex !important;
    flex-direction: column !important;
    flex: none !important;
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    overflow: visible !important;
  }

  /*
   * 最小化モード（右クリック → メニューを最小化）: アイコンのみ。
   * 中身は常に展開時の幅で描画して左端だけ見せるため、展開時は左から引き出すように現れ、アイコンは動かない。
   * ホバー中（html.sidebar-peek）は本文の上に重ねて展開する。
   */
  html.sidebar-mini #app-screen > .sidebar.offcanvas-lg {
    flex: 0 0 var(--shell-sidebar-mini-width) !important;
    width: var(--shell-sidebar-mini-width) !important;
    max-width: var(--shell-sidebar-mini-width) !important;
    z-index: 1045;
  }
  /* アニメーションはホバー・最小化操作時のみ（ページ遷移時に本文が動かないように） */
  html.sidebar-anim #app-screen > .sidebar.offcanvas-lg {
    transition: width 0.18s ease, max-width 0.18s ease, flex-basis 0.18s ease, margin-right 0.18s ease, box-shadow 0.18s ease;
  }
  html.sidebar-mini.sidebar-peek #app-screen > .sidebar.offcanvas-lg {
    flex: 0 0 var(--shell-sidebar-width) !important;
    width: var(--shell-sidebar-width) !important;
    max-width: var(--shell-sidebar-width) !important;
    margin-right: calc(var(--shell-sidebar-mini-width) - var(--shell-sidebar-width));
    box-shadow: 4px 0 16px rgba(0, 0, 0, 0.18);
  }
  html.sidebar-mini #app-screen > .sidebar.offcanvas-lg .offcanvas-body > .sidebar-brand,
  html.sidebar-mini #app-screen > .sidebar.offcanvas-lg .offcanvas-body > .sidebar-nav {
    width: var(--shell-sidebar-width) !important;
    min-width: var(--shell-sidebar-width) !important;
  }
  /* アイコン（幅 1.4rem）を最小化幅の中央に固定。展開中も同じ位置のまま */
  html.sidebar-mini #app-screen > .sidebar.offcanvas-lg .sidebar-nav .nav-link,
  html.sidebar-mini #app-screen > .sidebar.offcanvas-lg .sidebar-subnav .nav-link {
    padding-left: calc((var(--shell-sidebar-mini-width) - 1.4rem) / 2) !important;
  }
  html.sidebar-mini #app-screen > .sidebar.offcanvas-lg .nav-link > span:not(.nav-icon),
  html.sidebar-mini #app-screen > .sidebar.offcanvas-lg .sidebar-section-label {
    text-overflow: clip !important;
  }
  html.sidebar-mini.sidebar-anim #app-screen > .sidebar.offcanvas-lg .nav-link > span:not(.nav-icon),
  html.sidebar-mini.sidebar-anim #app-screen > .sidebar.offcanvas-lg .sidebar-section-label {
    transition: opacity 0.18s ease;
  }
  html.sidebar-mini:not(.sidebar-peek) #app-screen > .sidebar.offcanvas-lg .nav-link > span:not(.nav-icon),
  html.sidebar-mini:not(.sidebar-peek) #app-screen > .sidebar.offcanvas-lg .sidebar-section-label {
    opacity: 0;
  }
  html.sidebar-mini:not(.sidebar-peek) #app-screen > .sidebar.offcanvas-lg .offcanvas-body {
    scrollbar-width: none;
  }
  html.sidebar-mini:not(.sidebar-peek) #app-screen > .sidebar.offcanvas-lg .offcanvas-body::-webkit-scrollbar {
    width: 0;
  }
}

.sidebar-context-menu {
  position: fixed;
  z-index: 2000;
  min-width: 11rem;
  padding: 0.3rem 0;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.16);
}
.sidebar-context-menu button {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  width: 100%;
  padding: 0.45rem 0.9rem;
  border: 0;
  background: transparent;
  color: #333;
  font-size: 14px;
  text-align: left;
  white-space: nowrap;
}
.sidebar-context-menu button:hover,
.sidebar-context-menu button:focus-visible {
  background: #f3f4f6;
  outline: none;
}


.layout-col {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 0;
  height: 100%;
  overflow: hidden;
}

.topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  height: 52px;
  min-height: 52px;
  max-height: 52px;
  padding: 0 20px;
  background: #fff;
  border-bottom: 1px solid #e5e7eb;
  flex-shrink: 0;
  position: relative;
  z-index: 30;
  box-sizing: border-box;
}
.topbar-title {
  font-size: var(--type-heading-sm);
  font-weight: var(--type-weight-bold);
  color: var(--hirakumo-ink);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
}
.topbar-company {
  font-size: var(--type-body);
  font-weight: var(--type-weight-regular);
  color: var(--hirakumo-ink);
  white-space: nowrap;
  flex-shrink: 0;
  line-height: 1.2;
}
.topbar-heading {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  gap: 1.25rem;
  min-width: 0;
  flex: 0 1 auto;
  max-width: min(28rem, 42vw);
}
.topbar-date {
  font-size: 14px;
  font-weight: 600;
  color: #333;
  white-space: nowrap;
}
.topbar-right {
  display: flex;
  align-items: center;
  gap: 1rem;
  flex: 0 0 auto;
  margin-left: auto;
  min-width: 0;
}
@media (max-width: 991.98px) {
  .topbar {
    padding: 0 12px;
  }
  .topbar-heading {
    flex: 1 1 auto;
    max-width: none;
    gap: 0.75rem;
  }
  .topbar-right {
    gap: 0.75rem;
  }
  .topbar-company {
    flex-shrink: 1;
    min-width: 0;
    max-width: 14rem;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}
/* Phones: page title + avatar + ユーザー名 (日付 / 企業名 hidden) */
@media (max-width: 767.98px) {
  .topbar-date,
  .topbar-company {
    display: none;
  }
}
.topbar-flash {
  flex: 1 1 auto;
  justify-content: center;
  align-items: center;
  min-width: 0;
  max-width: min(48rem, 100%);
  margin: 0 auto;
  padding: 0 12px;
  overflow: visible;
}
.topbar-flash[x-cloak] {
  display: none !important;
}
.topbar-flash-alert {
  width: 100%;
  max-width: 100%;
  min-height: 40px;
  max-height: none;
  padding-top: 0.5rem !important;
  padding-bottom: 0.5rem !important;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.3;
  border-radius: 6px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
  overflow: visible;
}
/* Flash / alert — HIRAKUMO status colors (success = brand teal, error = danger) */
.alert-success,
.topbar-flash-alert.alert-success {
  --bs-alert-color: var(--hirakumo-brand-active);
  --bs-alert-bg: var(--hirakumo-focus-fill);
  --bs-alert-border-color: var(--hirakumo-info);
  --bs-alert-link-color: var(--hirakumo-brand-active);
  color: var(--hirakumo-brand-active) !important;
  background-color: var(--hirakumo-focus-fill) !important;
  border-color: var(--hirakumo-info) !important;
}
.alert-success .bi,
.topbar-flash-alert.alert-success .bi {
  color: var(--hirakumo-brand);
}
.alert-danger,
.topbar-flash-alert.alert-danger {
  --bs-alert-color: var(--hirakumo-danger);
  --bs-alert-bg: #FDECEC;
  --bs-alert-border-color: #F5C2C4;
  --bs-alert-link-color: var(--hirakumo-danger-hover);
  color: var(--hirakumo-danger) !important;
  background-color: #FDECEC !important;
  border-color: #F5C2C4 !important;
}
.alert-danger .bi,
.topbar-flash-alert.alert-danger .bi {
  color: var(--hirakumo-danger);
}
.topbar-flash-alert.alert-success .btn-close {
  --bs-btn-close-opacity: 0.55;
  filter: none;
}
.topbar-flash-alert.alert-danger .btn-close {
  --bs-btn-close-opacity: 0.55;
  filter: none;
}
.topbar-flash-message {
  min-width: 0;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.3;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}
@media (max-width: 991.98px) {
  .topbar-flash {
    position: fixed;
    top: 12px;
    left: 12px;
    right: 12px;
    z-index: 2000;
    max-width: none;
    margin: 0;
    padding: 0;
  }
}

.notif-btn {
  position: relative;
  text-decoration: none !important;
  color: inherit !important;
  font-size: 24px;
  line-height: 1;
  margin-right: 0.35rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.notif-btn .notif-btn-icon.app-icon,
.notif-btn .app-icon.notif-btn-icon {
  width: 1.75rem;
  height: 1.75rem;
  display: block;
}
.notif-badge {
  position: absolute;
  top: -7px;
  right: -9px;
  background: #B81C22;
  color: #fff;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  min-width: 18px;
  height: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 5px;
  line-height: 1;
  box-shadow: 0 0 0 2px #fff;
}

.user-menu {
  position: relative;
  flex-shrink: 0;
}
.user-chip {
  display: flex;
  align-items: center;
  gap: 8px;
}
.user-chip-btn {
  box-sizing: border-box;
  border: 1px solid transparent;
  background: transparent;
  border-radius: 10px;
  /* Keep hover inset inside the 52px topbar (avatar + padding + border < 52) */
  height: 40px;
  max-height: 40px;
  padding: 3px 8px 3px 3px;
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease;
}
@media (max-width: 767.98px) {
  .topbar-right {
    flex: 0 1 auto;
  }
  .user-menu {
    flex-shrink: 1;
    min-width: 0;
  }
  .user-chip-btn {
    gap: 6px;
    min-width: 0;
    max-width: 100%;
    padding: 3px 8px 3px 3px;
  }
  .user-chip-btn .user-name {
    min-width: 0;
    max-width: 7.5rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 13px;
  }
}
.user-chip-btn:hover,
.user-chip-btn[aria-expanded="true"] {
  background: #f3f4f6;
  border-color: #e5e7eb;
}
.user-chip-caret {
  font-size: 0.7rem;
  color: #6b7280;
  transition: transform 0.15s ease;
}
.user-chip-caret.is-open {
  transform: rotate(180deg);
}
.user-avatar {
  width: 32px;
  height: 32px;
  border-radius: 999px;
  background: #6b7280;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  font-weight: 700;
  overflow: hidden;
  flex-shrink: 0;
}
img.user-avatar,
.user-avatar--photo {
  background: #e5e7eb;
  object-fit: cover;
  padding: 0;
}
.user-name { font-size: 14px; color: #333; font-weight: 600; }
.user-menu-dropdown {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  z-index: 1050;
  min-width: 13.5rem;
  padding: 0.35rem;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.12);
}
.user-menu-item {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  width: 100%;
  border: 0;
  background: transparent;
  color: #333;
  border-radius: 7px;
  padding: 0.6rem 0.75rem;
  font-size: 0.875rem;
  font-weight: 600;
  text-align: left;
  text-decoration: none;
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.12s ease, color 0.12s ease;
}
.user-menu-item:hover {
  background: #f3f4f6;
  color: #333;
  text-decoration: none;
}
.user-menu-item i {
  width: 1.1rem;
  font-size: 1rem;
  line-height: 1;
  color: #6b7280;
  text-align: center;
}
.user-menu-item:hover i {
  color: #333;
}
.user-menu-divider {
  height: 1px;
  margin: 0.25rem 0.4rem;
  background: #e5e7eb;
}
.user-menu-item--danger {
  color: #B81C22;
}
.user-menu-item--danger i {
  color: #B81C22;
}
.user-menu-item--danger:hover {
  background: #FDECEC;
  color: #9A171C;
}
.user-menu-item--danger:hover i {
  color: #B81C22;
}
.user-menu-enter {
  transition: opacity 0.12s ease, transform 0.12s ease;
}
.user-menu-enter-start {
  opacity: 0;
  transform: translateY(-4px);
}
.user-menu-enter-end {
  opacity: 1;
  transform: translateY(0);
}
.user-menu-leave {
  transition: opacity 0.1s ease, transform 0.1s ease;
}
.user-menu-leave-start {
  opacity: 1;
  transform: translateY(0);
}
.user-menu-leave-end {
  opacity: 0;
  transform: translateY(-4px);
}

/* Top padding lives on .page (not the scrollport) so sticky thead can sit flush under .topbar.
   Footer lives inside the scrollport so it sits after page content (not over it). */
.main-content {
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding: 0 20px;
  display: flex;
  flex-direction: column;
  --sticky-thead-top: 0px;
  --main-content-pad-x: 20px;
  /* Match shell page bg so short 一覧 cards (e.g. 1on1 with few rows) do not
     blend into the flex-grown .page area below the card. */
  background: var(--shell-page-bg);
}
.main-content > .page {
  padding-top: 16px;
  padding-bottom: 24px;
  flex: 1 0 auto;
  background: transparent;
}
/* List cards size to rows; never stretch to fill the tall .page flex item */
.qm-list-panel > .dash-card,
.task-list-panel > .dash-card,
.notice-list-panel > .dash-card,
.inbox-list-panel > .dash-card,
.eval-list-panel > .dash-card {
  height: auto;
  min-height: 0;
  flex: none;
  align-self: flex-start;
  width: 100%;
}
.site-footer {
  flex-shrink: 0;
  margin-top: auto;
  margin-left: calc(-1 * var(--main-content-pad-x));
  margin-right: calc(-1 * var(--main-content-pad-x));
  text-align: center;
  padding: 0.65rem 1rem 0.85rem;
  border-top: 1px solid #e5e7eb;
  background: #fff;
}
.site-footer__text {
  margin: 0;
  font-size: 0.75rem;
  line-height: 1.4;
  color: #6b7280;
}
.page-content { max-width: 100%; width: 100%; }
.page { display: block; }

/* Nested panel wrappers: layout-only (Bootstrap .card is the chrome) */
.qm-list-panel,
.qm-detail-panel,
.task-list-panel,
.task-form-panel,
.notice-list-panel,
.notice-form-panel,
.inbox-list-panel,
.inbox-detail-panel,
.eval-list-panel,
.eval-detail-panel {
  background: transparent;
  border: none;
  padding: 0;
}
.eval-list-panel .eval-col-period-name {
  min-width: 11rem;
  max-width: 18rem;
  width: auto;
  white-space: nowrap;
}
.eval-list-panel th.text-start,
.eval-list-panel td.text-start {
  text-align: left !important;
}
.eval-list-panel .list-table,
.eval-list-panel .eval-list-table {
  table-layout: auto;
  width: 100%;
}
.eval-list-panel .list-table .list-col-start,
.eval-list-panel .list-table td[data-label="部下"],
.eval-list-panel .list-table td[data-label="従業員"],
.eval-list-panel .list-table td[data-label="上司１"],
.eval-list-panel .list-table td[data-label="上司２"],
.eval-list-panel .list-table td[data-label="査定期間"],
.eval-list-panel .list-table td[data-label="年度"] {
  white-space: nowrap !important;
  vertical-align: middle;
  word-break: keep-all;
  overflow-wrap: normal;
}
.eval-list-panel .list-table td[data-label="状態"],
.eval-list-panel .list-table th:nth-child(6),
.eval-list-panel .list-table .list-col-actions,
.eval-list-panel .list-table td[data-label="アクション"] {
  text-align: center !important;
  white-space: nowrap !important;
}
/* Tablets / small laptops: keep one-line cells, scroll horizontally instead of crushing (phones use cards) */
@media (min-width: 768px) and (max-width: 1399.98px) {
  .eval-list-panel .table-responsive:has(.eval-assign-list-table),
  .eval-list-panel .table-responsive.sticky-thead:has(.eval-assign-list-table) {
    overflow-x: auto !important;
  }
  .eval-list-panel .eval-assign-list-table {
    min-width: 58rem;
  }
  .eval-list-panel .eval-assign-list-table > :not(caption) > tr > :first-child {
    position: sticky;
    left: 0;
    z-index: 2;
    background: #fff;
  }
  .eval-list-panel .eval-assign-list-table > thead > tr > :first-child {
    z-index: 21;
    background: #e4e8e5;
  }
}
@media (max-width: 767.98px) {
  .eval-list-panel .list-table > tbody > tr > td[data-label] {
    white-space: normal !important;
  }

  /* 給与詳細 / 評価ランク: rowspans + unlabeled numbers — keep a real table that scrolls sideways */
  .table-responsive:has(> table.list-table:is(.eval-salary-score-table, .eval-salary-compare-table, .eval-salary-rank-ref-table)) {
    overflow-x: auto !important;
    padding: 0 !important;
    -webkit-overflow-scrolling: touch;
  }
  .table-responsive > table.list-table:is(.eval-salary-score-table, .eval-salary-compare-table, .eval-salary-rank-ref-table) {
    display: table !important;
    width: auto !important;
    min-width: 100% !important;
  }
  .table-responsive > table.list-table:is(.eval-salary-score-table, .eval-salary-compare-table, .eval-salary-rank-ref-table) > thead {
    display: table-header-group !important;
  }
  .table-responsive > table.list-table:is(.eval-salary-score-table, .eval-salary-compare-table, .eval-salary-rank-ref-table) > tbody {
    display: table-row-group !important;
  }
  .table-responsive > table.list-table:is(.eval-salary-score-table, .eval-salary-compare-table, .eval-salary-rank-ref-table) > tbody > tr {
    display: table-row !important;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
  }
  .table-responsive > table.list-table:is(.eval-salary-score-table, .eval-salary-compare-table, .eval-salary-rank-ref-table) > thead > tr > th,
  .table-responsive > table.list-table:is(.eval-salary-score-table, .eval-salary-compare-table, .eval-salary-rank-ref-table) > tbody > tr > td {
    display: table-cell !important;
    width: auto !important;
    max-width: none !important;
    padding: 0.35rem 0.6rem !important;
    text-align: center !important;
    white-space: nowrap !important;
  }
  .table-responsive > table.list-table:is(.eval-salary-score-table, .eval-salary-compare-table, .eval-salary-rank-ref-table) > thead > tr > th.list-col-start,
  .table-responsive > table.list-table:is(.eval-salary-score-table, .eval-salary-compare-table, .eval-salary-rank-ref-table) > tbody > tr > td.list-col-start {
    min-width: 7rem;
    text-align: left !important;
    white-space: normal !important;
  }
  .table-responsive > table.list-table:is(.eval-salary-score-table, .eval-salary-compare-table, .eval-salary-rank-ref-table) > tbody > tr > td::before {
    content: none !important;
  }
}

/* List / detail toggles (Livewire show/hide) */
.qm-layout .qm-detail-panel,
.emp-admin-layout .qm-detail-panel,
.rec-admin-layout .qm-detail-panel,
.role-master-layout .qm-detail-panel,
.fac-facility-layout .qm-detail-panel,
.notice-admin-layout .notice-form-panel,
.task-admin-layout .task-form-panel,
.inbox-layout .inbox-detail-panel,
.eval-layout .eval-detail-panel { display: none; }

.qm-layout.qm-layout--detail-view .qm-list-panel,
.emp-admin-layout.emp-admin-layout--detail-view .qm-list-panel,
.rec-admin-layout.rec-admin-layout--detail-view .qm-list-panel,
.role-master-layout.role-master-layout--detail-view .qm-list-panel,
.fac-facility-layout.fac-facility-layout--detail-view .qm-list-panel,
.notice-admin-layout.notice-admin-layout--detail-view .notice-list-panel,
.task-admin-layout.task-admin-layout--detail-view .task-list-panel,
.inbox-layout.inbox-layout--detail-view .inbox-list-panel,
.eval-layout.eval-layout--detail-view .eval-list-panel { display: none; }

.qm-layout.qm-layout--detail-view .qm-detail-panel,
.emp-admin-layout.emp-admin-layout--detail-view .qm-detail-panel,
.rec-admin-layout.rec-admin-layout--detail-view .qm-detail-panel,
.role-master-layout.role-master-layout--detail-view .qm-detail-panel,
.fac-facility-layout.fac-facility-layout--detail-view .qm-detail-panel,
.notice-admin-layout.notice-admin-layout--detail-view .notice-form-panel,
.task-admin-layout.task-admin-layout--detail-view .task-form-panel,
.inbox-layout.inbox-layout--detail-view .inbox-detail-panel,
.eval-layout.eval-layout--detail-view .eval-detail-panel { display: block; }

.table tr.active > * { --bs-table-bg-type: rgba(76, 187, 180, 0.12); }
.table tr[wire\:click] { cursor: pointer; }

/* Soft daily-use tables (still Bootstrap .table) — keep in sync with .list-table */
.page-content .table > :not(caption) > * > * {
  border-bottom-color: #f0f1f3;
  box-shadow: none;
}
.page-content .table thead th {
  background: #e4e8e5;
  border-bottom: none;
  color: #333;
  font-size: 14px;
  font-weight: 700;
  white-space: nowrap;
}
.page-content .table-hover > tbody > tr:hover > * {
  --bs-table-bg-state: #f6faf5;
}
.page-content .card > .table-responsive .table { margin-bottom: 0; }

/* Dashboard — modern soft panels (no hard borders) */
.dash-section-label {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 15px;
  color: #333;
}
.dash-page {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.dash-quick {
  background: transparent;
  border: none;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.dash-quick-card .dash-card-head {
  padding: 0.65rem 1.15rem 0 !important;
}
.dash-quick-bolt {
  font-size: 1.15rem;
  line-height: 1;
  filter: grayscale(0) sepia(1) saturate(8) hue-rotate(-10deg) brightness(1.05);
}
.dash-quick-body {
  padding: 0.1rem 1rem 0.4rem !important;
}
.dash-quick-rows {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
}
.dash-quick-card .quick-menu-grid {
  padding: 0;
}
.quick-menu-grid {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 4px 20px;
  overflow-x: visible;
  padding: 0;
}
.quick-btn {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: 4px;
  flex: 0 0 auto;
  width: 88px;
  min-width: 88px;
  max-width: 88px;
  padding: 4px 4px 2px;
  background: transparent;
  border: none;
  border-radius: 12px;
  box-shadow: none;
  text-decoration: none !important;
  color: #333 !important;
  cursor: pointer;
  font-family: inherit;
  transition: background-color 0.15s ease, transform 0.15s ease;
}
.quick-btn:hover {
  color: var(--shell-brand) !important;
  background: #f6faf5;
  box-shadow: none;
  transform: translateY(-2px);
}
.qb-icon-slot {
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.qb-icon {
  font-size: 2.35rem;
  line-height: 1;
  display: block;
  filter: drop-shadow(0 3px 6px rgba(16, 24, 40, 0.12));
}
.qb-icon-img {
  width: 48px;
  height: 48px;
  object-fit: contain;
  display: block;
  border-radius: 8px;
  background: #fff;
}
.qb-label {
  width: 100%;
  min-height: 2.4em;
  font-size: 12px;
  font-weight: 600;
  text-align: center;
  line-height: 1.3;
  color: inherit;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  word-break: break-word;
}

@media (max-width: 991.98px) {
  .quick-menu-grid {
    gap: 4px 16px;
  }
}
@media (max-width: 575.98px) {
  .quick-menu-grid {
    gap: 4px 12px;
  }
  .quick-btn {
    width: 76px;
    min-width: 76px;
    max-width: 76px;
  }
  .qb-icon-slot,
  .qb-icon-img {
    width: 44px;
    height: 44px;
  }
  .qb-icon { font-size: 2.1rem; }
}

.dash-card {
  border: none !important;
  border-radius: 16px !important;
  background: #fff;
  box-shadow: 0 4px 18px rgba(16, 24, 40, 0.06);
  overflow: hidden;
}
.dash-card-head {
  background: transparent !important;
  border-bottom: none !important;
  padding: 1rem 1.15rem 0.35rem !important;
}
.dash-card-head.d-flex {
  row-gap: 0.5rem;
}
@media (max-width: 767.98px) {
  .dash-card-head.d-flex {
    flex-wrap: wrap !important;
    align-items: flex-start !important;
  }
  .dash-card-head.d-flex > .btn,
  .dash-card-head.d-flex > .btn-group,
  .dash-card-head.d-flex > .d-flex {
    flex-shrink: 0;
  }
  .page-content {
    overflow-x: clip;
  }
}
.dash-card > .table-responsive {
  /* No side padding — row hover/selected backgrounds must span full card width.
     Horizontal inset comes from shared .list-table cell padding. */
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* ── Sticky 一覧 column headers (opt-in: class="table-responsive sticky-thead") ──
 * Portal offsets via CSS vars:
 *   --sticky-thead-top  distance under fixed/sticky chrome
 *     admin navbar = 64px; user .main-content scrollport = 0 (flush under .topbar)
 * Card title bars stay in normal flow. Mobile card layout hides thead anyway.
 */
:root {
  --sticky-thead-top: 0px;
}
.dash-card:has(.sticky-thead),
.dash-card:has(.sticky-thead) .card-body,
.dash-card:has(.sticky-thead) .qm-list-panel,
.dash-card:has(.admin-sticky-thead),
.dash-card:has(.admin-sticky-thead) .card-body,
.dash-card:has(.admin-sticky-thead) .qm-list-panel {
  overflow: visible !important;
}
.sticky-thead,
.admin-sticky-thead {
  overflow: visible !important;
}
@media (min-width: 768px) {
  .sticky-thead > .table,
  .sticky-thead .list-table,
  .admin-sticky-thead > .table,
  .admin-sticky-thead .list-table {
    border-collapse: separate;
    border-spacing: 0;
  }
  /* Higher specificity than `.page-content .table > :not(caption) > * > *` (box-shadow: none) */
  .page-content .sticky-thead > .table thead th,
  .page-content .sticky-thead .list-table thead th,
  .sticky-thead > .table thead th,
  .sticky-thead .list-table thead th,
  .admin-sticky-thead > .table thead th,
  .admin-sticky-thead .list-table thead th {
    position: sticky;
    top: var(--sticky-thead-top);
    z-index: 20;
    background: #e4e8e5 !important;
    box-shadow: none !important;
  }
}

/* ── Shared 一覧 table (use class="table … list-table") ── */
.list-table,
.dash-card > .table-responsive > .table {
  --list-pad-x: 1.15rem;
  --list-pad-y: 0.7rem;
  --list-head-pad-y: 0.65rem;
  --list-pad-edge: 1.75rem;
  --list-font: 14px;
  --list-head-font: 14px;
  --list-head-bg: #e4e8e5;
  margin-bottom: 0;
  font-size: var(--list-font);
  color: #333;
}
.list-table > :not(caption) > * > *,
.dash-card > .table-responsive > .table > :not(caption) > * > * {
  padding: var(--list-pad-y) var(--list-pad-x);
  vertical-align: middle;
  border-bottom-color: #f0f1f3;
  text-align: center;
  box-shadow: none;
  font-size: var(--list-font);
  line-height: 1.35;
}
.list-table > :not(caption) > * > *:first-child,
.dash-card > .table-responsive > .table > :not(caption) > * > *:first-child {
  padding-left: var(--list-pad-edge);
  /* Match お知らせ一覧: first column hugs the left gutter, not centered in a wide cell */
  text-align: left !important;
}
.list-table > :not(caption) > * > *[data-label="コード"],
.list-table > :not(caption) > * > *[data-label="名称"],
.list-table > :not(caption) > * > *[data-label="カテゴリ名"],
.dash-card > .table-responsive > .table > :not(caption) > * > *[data-label="コード"],
.dash-card > .table-responsive > .table > :not(caption) > * > *[data-label="名称"],
.dash-card > .table-responsive > .table > :not(caption) > * > *[data-label="カテゴリ名"] {
  text-align: left !important;
}
.list-table > :not(caption) > * > *[data-label="表示順"],
.dash-card > .table-responsive > .table > :not(caption) > * > *[data-label="表示順"] {
  text-align: center !important;
}
.list-table > :not(caption) > * > *:last-child,
.dash-card > .table-responsive > .table > :not(caption) > * > *:last-child {
  padding-right: var(--list-pad-edge);
}
.list-table thead th,
.dash-card > .table-responsive > .table.list-table thead th,
.dash-card > .table-responsive > .table thead th {
  padding-top: var(--list-pad-y);
  padding-bottom: var(--list-pad-y);
  background: #e4e8e5 !important;
  border-bottom: none !important;
  color: #333 !important;
  font-size: var(--list-font) !important;
  font-weight: 700 !important;
  line-height: 1.35;
  white-space: nowrap;
}
.kpi-page:not(.kpi-manage-page) .sticky-thead > .table thead th,
.kpi-page:not(.kpi-manage-page) .sticky-thead .list-table thead th {
  background: #e4e8e5 !important;
  box-shadow: none !important;
}
/* Neutralize Bootstrap .small / muted size drift inside 一覧 */
.list-table thead th.small,
.dash-card > .table-responsive > .table thead th.small,
.list-table thead th.text-muted,
.dash-card > .table-responsive > .table thead th.text-muted {
  font-size: var(--list-font) !important;
  font-weight: 700 !important;
  color: #333 !important;
}
.list-table tbody td,
.list-table tbody td .fw-semibold,
.list-table tbody td .fw-bold,
.list-table tbody td .fw-medium,
.list-table tbody td .task-title,
.dash-card > .table-responsive > .table tbody td,
.dash-card > .table-responsive > .table tbody td .fw-semibold,
.dash-card > .table-responsive > .table tbody td .fw-bold,
.dash-card > .table-responsive > .table tbody td .fw-medium,
.meeting-meta-table tbody td,
.meeting-meta-table tbody td .fw-semibold,
.meeting-agenda-table tbody td,
.meeting-agenda-table tbody td .fw-semibold {
  font-weight: 400 !important;
}
.list-table tbody td .small,
.dash-card > .table-responsive > .table tbody td .small {
  font-size: 13px !important;
  line-height: 1.4;
}
.list-table tbody td.small,
.dash-card > .table-responsive > .table tbody td.small {
  font-size: var(--list-font) !important;
}
.list-table tbody tr:last-child > *,
.dash-card > .table-responsive > .table tbody tr:last-child > * {
  border-bottom: none !important;
}
/* タイトル / 期間 / other text columns stay left-aligned */
.list-table .list-col-start,
.dash-card > .table-responsive > .table .list-col-start,
.list-table > :not(caption) > * > *.list-col-start,
.dash-card > .table-responsive > .table > :not(caption) > * > *.list-col-start {
  text-align: left !important;
}
/* Empty-state rows (〜がありません) — normal row height, not py-5 tall */
.list-table tbody td.text-center.text-muted,
.dash-card > .table-responsive > .table tbody td.text-center.text-muted,
.table tbody td.text-center.text-muted.py-5,
.table tbody td.text-center.text-muted.py-4 {
  padding-top: var(--list-pad-y, 0.45rem) !important;
  padding-bottom: var(--list-pad-y, 0.45rem) !important;
  text-align: center !important;
}
/* Blade py-3 must not restore the old tall rows */
.list-table td.py-3,
.dash-card > .table-responsive > .table td.py-3 {
  padding-top: var(--list-pad-y) !important;
  padding-bottom: var(--list-pad-y) !important;
}
/* Explicit center (e.g. 完了 checkbox) wins over first-column left */
.list-table .list-col-center,
.list-table th.text-center,
.list-table td.text-center,
.dash-card > .table-responsive > .table .list-col-center,
.dash-card > .table-responsive > .table th.text-center,
.dash-card > .table-responsive > .table td.text-center,
.list-table > :not(caption) > * > *.list-col-center,
.dash-card > .table-responsive > .table > :not(caption) > * > *.list-col-center {
  text-align: center !important;
}
/* アクション column — room for 編集 + 削除 (or 確認 buttons) */
.list-table .list-col-actions,
.dash-card > .table-responsive > .table .list-col-actions {
  min-width: 11.5rem;
  width: 11.5rem;
  white-space: nowrap;
}
.list-table .list-col-ops,
.dash-card > .table-responsive > .table .list-col-ops {
  min-width: 9.5rem;
  width: 9.5rem;
  white-space: nowrap;
  text-align: center !important;
}

/* ── Mobile 一覧: card stack (no horizontal scroll) ── */
@media (max-width: 767.98px) {
  .page-content .table-responsive:has(.list-table),
  .dash-card > .table-responsive:has(.list-table),
  .table-responsive:has(> .list-table) {
    overflow-x: visible !important;
    /* Inset from card edge — cell padding alone is easy to lose with table display quirks */
    padding-left: 0.85rem !important;
    padding-right: 0.85rem !important;
    padding-bottom: 0.65rem !important;
  }

  .list-table,
  .dash-card > .table-responsive > .table.list-table {
    /* Required so tr margins / block layout work reliably in WebKit */
    display: block !important;
    width: 100% !important;
  }

  .list-table thead,
  .dash-card > .table-responsive > .table.list-table thead {
    display: none !important;
  }

  .list-table > tbody,
  .list-table > tbody > tr,
  .list-table > tbody > tr > td,
  .dash-card > .table-responsive > .table.list-table > tbody,
  .dash-card > .table-responsive > .table.list-table > tbody > tr,
  .dash-card > .table-responsive > .table.list-table > tbody > tr > td {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  .list-table > tbody > tr,
  .dash-card > .table-responsive > .table.list-table > tbody > tr {
    margin: 0.55rem 0;
    padding: 0.2rem 0;
    border: 1px solid #e8eaed;
    border-radius: 0.65rem;
    background: #fff;
    box-shadow: none;
  }

  .list-table > tbody > tr:last-child,
  .dash-card > .table-responsive > .table.list-table > tbody > tr:last-child {
    margin-bottom: 0.25rem;
  }

  .list-table > tbody > tr > td,
  .dash-card > .table-responsive > .table.list-table > tbody > tr > td {
    display: flex !important;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.6rem 1.1rem !important;
    text-align: right !important;
    border-bottom: 1px solid #f3f4f6 !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  .list-table > tbody > tr > td:last-child,
  .dash-card > .table-responsive > .table.list-table > tbody > tr > td:last-child {
    border-bottom: none !important;
  }

  .list-table > tbody > tr > td::before,
  .dash-card > .table-responsive > .table.list-table > tbody > tr > td::before {
    content: attr(data-label);
    flex: 0 0 auto;
    max-width: 42%;
    text-align: left;
    color: #333;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.4;
    padding-right: 0.5rem;
  }

  .list-table > tbody > tr > td:not([data-label])::before,
  .list-table > tbody > tr > td[data-label=""]::before,
  .dash-card > .table-responsive > .table.list-table > tbody > tr > td:not([data-label])::before,
  .dash-card > .table-responsive > .table.list-table > tbody > tr > td[data-label=""]::before {
    content: none;
  }

  .list-table > tbody > tr > td.list-col-actions,
  .list-table > tbody > tr > td[data-label="アクション"],
  .list-table > tbody > tr > td[data-label="操作"],
  .dash-card > .table-responsive > .table.list-table > tbody > tr > td.list-col-actions,
  .dash-card > .table-responsive > .table.list-table > tbody > tr > td[data-label="アクション"],
  .dash-card > .table-responsive > .table.list-table > tbody > tr > td[data-label="操作"] {
    justify-content: flex-end;
    gap: 0.75rem;
    padding-top: 0.7rem !important;
    padding-bottom: 0.75rem !important;
    background: #fafbfa;
    border-top: 1px solid #f0f1f3 !important;
    border-bottom: none !important;
    border-radius: 0 0 0.65rem 0.65rem;
  }

  .list-table > tbody > tr > td.list-col-actions::before,
  .list-table > tbody > tr > td[data-label="アクション"]::before,
  .list-table > tbody > tr > td[data-label="操作"]::before,
  .dash-card > .table-responsive > .table.list-table > tbody > tr > td.list-col-actions::before,
  .dash-card > .table-responsive > .table.list-table > tbody > tr > td[data-label="アクション"]::before,
  .dash-card > .table-responsive > .table.list-table > tbody > tr > td[data-label="操作"]::before {
    display: none;
  }

  /* Empty-state row: single centered message */
  .list-table > tbody > tr > td.text-center.text-muted,
  .list-table > tbody > tr > td[colspan],
  .dash-card > .table-responsive > .table.list-table > tbody > tr > td.text-center.text-muted,
  .dash-card > .table-responsive > .table.list-table > tbody > tr > td[colspan] {
    display: block !important;
    text-align: center !important;
    justify-content: center;
    border-bottom: none !important;
    padding: 1rem 1.1rem !important;
  }

  .list-table > tbody > tr > td.text-center.text-muted::before,
  .list-table > tbody > tr > td[colspan]::before,
  .dash-card > .table-responsive > .table.list-table > tbody > tr > td.text-center.text-muted::before,
  .dash-card > .table-responsive > .table.list-table > tbody > tr > td[colspan]::before {
    content: none !important;
  }

  .list-table > tbody > tr:has(> td.text-center.text-muted),
  .list-table > tbody > tr:has(> td[colspan]:only-child),
  .dash-card > .table-responsive > .table.list-table > tbody > tr:has(> td.text-center.text-muted),
  .dash-card > .table-responsive > .table.list-table > tbody > tr:has(> td[colspan]:only-child) {
    border: none;
    background: transparent;
    margin: 0.35rem 0;
    box-shadow: none;
  }

  /* Tighten employee name widths on mobile cards */
  .emp-admin-table .emp-col-name,
  .emp-admin-table .emp-col-authority,
  .emp-admin-table .emp-col-dept,
  .emp-admin-table .emp-col-role {
    width: auto !important;
  }

  .list-table .list-col-actions,
  .dash-card > .table-responsive > .table .list-col-actions {
    min-width: 0 !important;
    width: 100% !important;
  }

  .kpi-table.kpi-table--stack,
  .kpi-table.kpi-table--stack th,
  .kpi-table.kpi-table--stack td {
    width: 100% !important;
  }

  .kpi-table.kpi-table--stack th:nth-child(6),
  .kpi-table.kpi-table--stack td:nth-child(6),
  .kpi-table.kpi-table--stack .kpi-col-toggle {
    min-width: 0 !important;
    max-width: none !important;
    text-align: right;
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
  }
}

.page-content .table-hover > tbody > tr:hover > * {
  --bs-table-bg-state: #f6faf5;
}
.dash-card .card-body { padding: 0.75rem 1.15rem 1.15rem; }
.dash-card .card-title { font-size: 15px; color: #333; }

/* Separate 削除 from 保存 when キャンセル / 削除 / 保存 appear together */
.form-footer-sep {
  align-self: stretch;
  width: 1px;
  min-height: 1.75rem;
  margin: 0.15rem 0.35rem;
  background: #d1d5db;
  flex-shrink: 0;
}

.philosophy-text,
.philosophy-sub {
  white-space: pre-line;
  overflow-wrap: anywhere;
  word-break: break-word;
}

/* 企業理念 / ポリシー photos: any size image is scaled down to fit inside the fixed frame */
.dash-policy-photo {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 220px;
  margin-bottom: 0.6rem;
  padding: 6px;
  background: #fff;
  border: 1px solid #e3e7e4;
  border-radius: 8px;
  overflow: hidden;
  cursor: zoom-in;
}
.dash-policy-photo:last-child { margin-bottom: 0; }
.dash-policy-photo img {
  display: block;
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
}
@media (max-width: 575.98px) {
  .dash-policy-photo { height: 180px; }
}
button.dash-policy-photo { font: inherit; }
button.dash-policy-photo:focus-visible { outline: 2px solid rgba(var(--bs-primary-rgb), 0.4); outline-offset: 2px; }

/* In-app photo viewer (dashboard policy photos) */
.photo-viewer {
  position: fixed;
  inset: 0;
  z-index: 2000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
  background: rgba(15, 23, 42, 0.6);
}
.photo-viewer-dialog {
  display: flex;
  flex-direction: column;
  max-width: min(1100px, 100%);
  max-height: 100%;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 20px 50px rgba(15, 23, 42, 0.3);
  overflow: hidden;
}
.photo-viewer-head {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.7rem 1rem;
  border-bottom: 1px solid #eef2f6;
}
.photo-viewer-title {
  font-weight: 700;
  color: var(--bs-primary);
}
.photo-viewer-body {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  background: #f8fafc;
  overflow: auto;
}
.photo-viewer-body img {
  display: block;
  max-width: 100%;
  max-height: calc(100vh - 3rem - 3.2rem - 2rem);
  width: auto;
  height: auto;
  object-fit: contain;
}
@media (max-width: 575.98px) {
  .photo-viewer { padding: 0.75rem; }
  .photo-viewer-body { padding: 0.5rem; }
  .photo-viewer-body img { max-height: calc(100dvh - 1.5rem - 3.2rem - 1rem); }
}

/* マスタ: policy photo upload */
.policy-photo-dropzone {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 100%;
  max-width: 420px;
  min-height: 120px;
  padding: 10px;
  border: 2px dashed #cfd6d2;
  border-radius: 8px;
  background: #fafbfa;
  text-align: center;
  cursor: pointer;
}
.policy-photo-dropzone:hover { border-color: var(--bs-primary, #0d9488); }
.policy-photo-frame {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 220px;
  background: #fff;
  border-radius: 6px;
  overflow: hidden;
}
.policy-photo-frame img {
  display: block;
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
}
.dash-cards .table thead th,
.dash-cards .list-table thead th,
.dash-cards .dash-card > .table-responsive > .table.list-table thead th {
  background: var(--list-head-bg, #e4e8e5) !important;
  border-bottom: none !important;
}
.dash-cards .table-light { --bs-table-bg: var(--list-head-bg, #e4e8e5); }

/* お知らせ / タスク: exact N full rows (no half-clipped last line) */
.dash-page .dash-list-scroll {
  --dash-list-head-h: 2.5rem;
  --dash-list-row-h: 2.85rem; /* fits due/priority pills + padding */
  --dash-list-rows: 2;
  height: calc(var(--dash-list-head-h) + var(--dash-list-rows) * var(--dash-list-row-h));
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}
.dash-page .dash-list-table {
  table-layout: fixed;
  width: 100%;
}
.dash-page .dash-list-table .dash-list-col-date {
  width: 5.25rem;
  white-space: nowrap;
  padding-left: 1rem;
}
.dash-page .dash-list-table .dash-list-col-meta {
  width: 5.5rem;
  white-space: nowrap;
  padding-right: 1rem;
}
.dash-page .dash-list-scroll td.list-col-start {
  max-width: 0;
  width: 100%;
}
.dash-page .dash-list-scroll .qm-row-title {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dash-page .dash-list-scroll td.list-col-start > .d-flex {
  min-width: 0;
}
.dash-page .dash-list-scroll td.list-col-start > .d-flex > .qm-row-title {
  flex: 1 1 auto;
}
.dash-page .dash-list-scroll > .table {
  border-collapse: separate;
  border-spacing: 0;
}
/* Lock cell box so row-h matches container math (shared list padding is taller) */
.dash-page .dash-list-scroll > .table > :not(caption) > * > * {
  padding-top: 0.4rem !important;
  padding-bottom: 0.4rem !important;
  line-height: 1.25;
  box-sizing: border-box;
  border-bottom-width: 0 !important;
}
.dash-page .dash-list-scroll thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  height: var(--dash-list-head-h);
  max-height: var(--dash-list-head-h);
  box-sizing: border-box;
  background: var(--list-head-bg, #e4e8e5) !important;
}
.dash-page .dash-list-scroll tbody tr {
  height: var(--dash-list-row-h);
}
.dash-page .dash-list-scroll tbody td {
  height: var(--dash-list-row-h);
  max-height: var(--dash-list-row-h);
  overflow: hidden;
  box-sizing: border-box;
  vertical-align: middle;
}
.page-content .table thead.table-light th,
.dash-card .table-light,
.dash-card .table thead.table-light th {
  --bs-table-bg: var(--list-head-bg, #e4e8e5);
  background: var(--list-head-bg, #e4e8e5) !important;
}
.dash-card .table thead th {
  border-bottom: none;
}

.kgi-upper-ref {
  background: #f6faf5;
  border: 1px solid #e5efe6;
  border-radius: 12px;
  padding: 0.85rem 1rem;
}
.kgi-upper-ref-label {
  font-size: 13px;
  font-weight: 600;
  color: #333;
  margin-bottom: 0.25rem;
}
.kgi-upper-ref-name {
  font-size: 15px;
  font-weight: 600;
  color: #333;
  line-height: 1.4;
}
.kgi-upper-ref-target {
  font-size: 13px;
  color: #333;
  margin-top: 0.15rem;
}

.greeting {
  font-size: 16px;
  font-weight: 600;
  color: #333;
}

/* Dashboard top row: stretch cards; KGI fills leftover height */
.dash-page > .dash-cards:not(.dash-bottom-cards) > [class*="col"] {
  display: flex;
}
.dash-page > .dash-cards:not(.dash-bottom-cards) > [class*="col"] > .dash-card {
  width: 100%;
}
.dash-page > .dash-bottom-cards > [class*="col"] {
  display: flex;
}
.dash-page > .dash-bottom-cards > [class*="col"] > .dash-card {
  width: 100%;
}
.dash-ai-card {
  flex: 1 1 auto;
  min-height: 100%;
}
.dash-kgi-card {
  display: flex;
  flex-direction: column;
  width: 100%;
  flex: 1 1 auto;
  min-height: calc(3.25rem + 0.35rem + 0.7rem + (2 * 4.35rem));
}
.dash-kgi-body {
  padding: 0.35rem 1rem 0.7rem !important;
  flex: 1 1 auto;
  min-height: calc(0.35rem + 0.7rem + (2 * 4.35rem));
  height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
}
.dash-kgi-row {
  padding: 0.65rem 0;
  border-bottom: 1px solid #f0f1f3;
  min-width: 0;
}
.dash-kgi-row:last-child {
  border-bottom: none;
  padding-bottom: 0.15rem;
}
.dash-kgi-source {
  font-size: 11px;
  font-weight: 600;
  color: #6b7280;
  line-height: 1.3;
  margin-bottom: 0.15rem;
}
.dash-kgi-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.5rem;
  min-width: 0;
}
.dash-kgi-name {
  font-size: 13px;
  font-weight: 600;
  color: #333;
  line-height: 1.35;
  min-width: 0;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.dash-kgi-rate {
  flex-shrink: 0;
  font-size: 13px;
  font-weight: 700;
  color: #333;
  line-height: 1.35;
}
.dash-kgi-target {
  font-size: 12px;
  color: #6b7280;
  margin: 0.2rem 0 0.45rem;
  line-height: 1.35;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.dash-kgi-body .kpi-progress-track {
  height: 8px;
  width: 100%;
  background: #e8ece9;
  border-radius: 999px;
  overflow: hidden;
}
.dash-kgi-body .kpi-progress-track .progress-bar {
  border-radius: 999px;
}

/* Laptop dashboard: larger readable UI that still fits typical laptop viewports */
@media (min-width: 992px) and (max-width: 1599.98px) {
  .main-content:has(.dash-page) {
    padding-left: 14px;
    padding-right: 14px;
    --main-content-pad-x: 14px;
  }
  .main-content:has(.dash-page) > .page {
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .dash-page {
    gap: 0.4rem;
  }
  .dash-quick {
    gap: 0.4rem;
  }
  .dash-quick-card .dash-card-head {
    padding: 0.45rem 1rem 0 !important;
  }
  .dash-quick-body {
    padding: 0 0.75rem 0.3rem !important;
  }
  .quick-menu-grid {
    gap: 2px 14px;
  }
  .quick-btn {
    width: 92px;
    min-width: 92px;
    max-width: 92px;
    padding: 2px 2px 0;
    gap: 2px;
  }
  .qb-icon-slot,
  .qb-icon-img {
    width: 52px;
    height: 52px;
  }
  .qb-icon {
    font-size: 2.55rem;
  }
  .qb-label {
    font-size: 13px;
    min-height: 2.2em;
  }
  .dash-card-head {
    padding: 0.7rem 1rem 0.25rem !important;
  }
  .dash-card .card-body {
    padding: 0.5rem 1rem 0.85rem;
  }
  .dash-card .card-title {
    font-size: 16px;
  }
  .dash-page .philosophy-text {
    font-size: 15px;
    line-height: 1.55;
  }
  .dash-page .philosophy-sub {
    font-size: 13px;
  }
  .dash-page .policy-list li.small {
    font-size: 13.5px !important;
    line-height: 1.5;
  }
  .dash-page .policy-list li.mb-2 {
    margin-bottom: 0.45rem !important;
  }
  .dash-kgi-name,
  .dash-kgi-rate {
    font-size: 14px;
  }
  .dash-kgi-target {
    font-size: 13px;
  }
  .dash-kgi-row {
    padding: 0.5rem 0;
  }
  .dash-kgi-body {
    padding: 0.25rem 0.9rem 0.55rem !important;
  }
  .dash-page .dash-list-scroll {
    --dash-list-head-h: 2.4rem;
    --dash-list-row-h: 2.7rem;
    --dash-list-rows: 2;
  }
  .dash-page .dash-list-scroll tbody td,
  .dash-page .dash-list-scroll .qm-row-title {
    font-size: 14px;
  }
  .dash-cards.row {
    --bs-gutter-x: 0.45rem;
    --bs-gutter-y: 0.45rem;
  }
}

/* Shorter laptop screens: keep the full dashboard in one view (2 rows) */
@media (min-width: 992px) and (max-height: 849.98px) {
  .main-content:has(.dash-page) > .page {
    padding-top: 8px;
    padding-bottom: 8px;
  }
  .dash-page {
    gap: 0.3rem;
  }
  .dash-quick-card .dash-card-head {
    padding: 0.35rem 0.9rem 0 !important;
  }
  .dash-quick-body {
    padding: 0 0.65rem 0.2rem !important;
  }
  .qb-icon-slot,
  .qb-icon-img {
    width: 46px;
    height: 46px;
  }
  .qb-icon {
    font-size: 2.25rem;
  }
  .qb-label {
    font-size: 12.5px;
    min-height: 2em;
  }
  .dash-card-head {
    padding: 0.55rem 0.9rem 0.2rem !important;
  }
  .dash-card .card-body {
    padding: 0.4rem 0.9rem 0.65rem;
  }
  .dash-page .dash-list-scroll {
    --dash-list-head-h: 2.25rem;
    --dash-list-row-h: 2.6rem;
    --dash-list-rows: 2;
  }
}

/* Large monitor: 4 full rows (after laptop overrides so this wins) */
@media (min-width: 1400px) and (min-height: 850px) {
  .dash-page .dash-list-scroll {
    --dash-list-head-h: 2.5rem;
    --dash-list-row-h: 2.85rem;
    --dash-list-rows: 4;
  }
}

/* Laptop: slightly tighter main padding */
@media (min-width: 992px) and (max-width: 1399.98px) {
  .main-content {
    padding: 0 16px;
    --main-content-pad-x: 16px;
  }
  .main-content > .page {
    padding-top: 14px;
    padding-bottom: 14px;
  }
}

/* KGI / KPI page */
.kpi-page .kpi-filter-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.65rem 0.85rem;
}
.kpi-page .kpi-filter-row .filter-label {
  font-size: 12px;
  font-weight: 600;
  color: #6b7280;
}
.kpi-page .kpi-filter-row .kgi-period-select {
  width: auto;
  min-width: min(100%, 22rem);
  max-width: 100%;
}
.kpi-page .kpi-filter-row .ref-note {
  font-size: 12px;
  color: #9ca3af;
}
.kpi-page .kpi-hero {
  background: #fff;
  border-radius: 12px;
  /* Match .list-table first-column edge (--list-pad-edge: 1.75rem) */
  padding: 0.85rem 1.75rem 0.65rem;
}
.kpi-page .dash-card > .card-body:has(.kpi-hero) {
  padding-left: 0;
  padding-right: 0;
}
.kpi-page .kpi-hero--full {
  width: 100%;
}
.kpi-page .kpi-hero-title {
  font-size: 1.25rem;
  font-weight: 700;
  color: #333;
}
.kpi-page .kpi-hero-value {
  font-size: 1.35rem;
  font-weight: 700;
  color: #333;
  line-height: 1.3;
}
.kpi-page .kpi-hero-unit {
  font-size: 0.95rem;
  font-weight: 500;
  color: #6b7280;
}
.kpi-page .kpi-meta-label {
  font-size: 11px;
  color: #9ca3af;
  margin-bottom: 2px;
}
.kpi-page .kpi-meta-value {
  font-size: 13px;
  font-weight: 600;
  color: #333;
}
.kpi-manage-rate {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.65rem 1rem;
  padding: 0.65rem 0.85rem;
  background: #E6F7F5;
  border-radius: 8px;
}
.kpi-manage-rate-label {
  font-size: 12px;
  font-weight: 600;
  color: #4b5563;
}
.ksf-kpi-pair-title {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}
.ksf-kpi-pair-num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.65rem;
  height: 1.65rem;
  padding: 0 0.4rem;
  border-radius: 999px;
  background: #4CBBB4;
  color: #fff;
  font-size: 0.85rem;
  font-weight: 700;
  line-height: 1;
}
.kpi-manage-rate-value {
  margin-left: auto;
  font-size: 14px;
  font-weight: 700;
  color: #4CBBB4;
}
.kpi-manage-rate-bar {
  flex: 1 1 100%;
  height: 8px;
  border-radius: 999px;
  background: rgba(76, 187, 180, 0.18);
}
.kpi-manage-rate-bar .progress-bar {
  border-radius: 999px;
}
.kpi-rate {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  min-width: 7.5rem;
}
.kpi-rate-num {
  font-size: 13px;
  font-weight: 700;
  color: #333;
  min-width: 2.4rem;
  font-variant-numeric: tabular-nums;
}
.kpi-rate-bar {
  height: 8px;
  flex: 1;
  background: #e8ece9;
  border-radius: 999px;
  overflow: hidden;
}
.kpi-rate-bar .progress-bar {
  border-radius: 999px;
}
.kpi-table > :not(caption) > * > * {
  /* padding / align from shared .list-table */
  border-bottom-color: #f0f1f3;
}
/* KGI + 部門目標 stacked cards: shared column grid so 目標/実績/進捗 line up */
.kpi-table.kpi-table--stack {
  table-layout: fixed;
  width: 100%;
}
.kpi-table.kpi-table--stack .kpi-col-name { width: 26%; }
.kpi-table.kpi-table--stack .kpi-col-meta { width: 24%; min-width: 12.75rem; }
.kpi-table.kpi-table--stack .kpi-col-num { width: 12%; }
.kpi-table.kpi-table--stack .kpi-col-progress { width: 16%; }
.kpi-table.kpi-table--stack .kpi-col-toggle {
  width: 4.5rem;
}
.kpi-table.kpi-table--stack th:nth-child(1),
.kpi-table.kpi-table--stack td:nth-child(1) { width: 26%; }
.kpi-table.kpi-table--stack th:nth-child(2),
.kpi-table.kpi-table--stack td:nth-child(2) { width: 24%; min-width: 12.75rem; }
.kpi-table.kpi-table--stack th:nth-child(3),
.kpi-table.kpi-table--stack td:nth-child(3) { width: 12%; }
.kpi-table.kpi-table--stack th:nth-child(4),
.kpi-table.kpi-table--stack td:nth-child(4) { width: 12%; }
.kpi-table.kpi-table--stack th:nth-child(5),
.kpi-table.kpi-table--stack td:nth-child(5) { width: 16%; }
.kpi-table.kpi-table--stack th:nth-child(6),
.kpi-table.kpi-table--stack td:nth-child(6) {
  width: 4.5rem;
  min-width: 4.5rem;
  max-width: 4.5rem;
  text-align: center;
  padding-left: 0.15rem !important;
  padding-right: 0.5rem !important;
}
.kpi-table.kpi-table--stack td:nth-child(1) {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.kpi-table.kpi-table--stack td:nth-child(2) {
  overflow: visible;
  text-overflow: unset;
  white-space: nowrap;
}
.kpi-table.kpi-table--stack .kpi-ksf-head th {
  background: #f7faf7;
  font-size: 0.8125rem;
  font-weight: 600;
  color: #6b7280;
  border-top: 1px solid #e8ece9;
}
.kpi-table.kpi-table--stack .kpi-ksf-row td {
  background: #fcfdfc;
}
.kpi-table.kpi-table--stack .kpi-ksf-row td:nth-child(1) {
  overflow: visible;
  text-overflow: unset;
  white-space: normal;
}
.kpi-page .kpi-expand-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  padding: 0;
  border: 0;
  background: transparent;
  color: #4CBBB4;
  line-height: 1;
}
.kpi-page .kpi-expand-btn:hover,
.kpi-page .kpi-expand-btn:focus {
  color: #3AA99C;
}
.kpi-page .kpi-expand-btn .bi {
  font-size: 1.15rem;
  display: inline-block;
  transition: transform 0.15s ease;
}
.kpi-page .kpi-expand-btn[aria-expanded="true"] .bi {
  transform: rotate(180deg);
}
.kpi-page .kpi-delete-btn {
  color: #9ca3af;
}
.kpi-page .kpi-delete-btn:hover,
.kpi-page .kpi-delete-btn:focus {
  color: #B81C22;
}
.kpi-ksf-stack {
  display: flex;
  flex-direction: column;
  gap: 0.12rem;
  min-width: 0;
}
.kpi-ksf-stack-ksf {
  font-weight: 700;
  line-height: 1.35;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.kpi-ksf-stack-kpi {
  font-weight: 400;
  line-height: 1.35;
  margin-left: 0.9rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.kpi-row-actions {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0;
}
.kpi-page .kpi-row-actions .kpi-expand-btn {
  width: 1.5rem;
  height: 1.5rem;
}
.kpi-page .kpi-row-actions .kpi-expand-btn .bi {
  font-size: 0.95rem;
}
.kpi-page .kpi-edit-btn {
  color: #4CBBB4;
}
.kpi-page .kpi-edit-btn:hover,
.kpi-page .kpi-edit-btn:focus {
  color: #3AA99C;
}
.kpi-actual-inline {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  min-width: 0;
  max-width: 100%;
}
.kpi-actual-inline > span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.kpi-page .kpi-actual-edit-btn {
  width: 1.5rem;
  height: 1.5rem;
  flex-shrink: 0;
}
.kpi-page .kpi-actual-edit-btn .bi {
  font-size: 0.95rem;
}
@media (max-width: 767.98px) {
  .kpi-page .kpi-row-actions {
    gap: 0.5rem;
  }
  .kpi-page .kpi-row-actions .kpi-expand-btn,
  .kpi-page .kpi-actual-edit-btn {
    width: 2.25rem;
    height: 2.25rem;
  }
}
.kpi-status {
  display: inline-flex;
  align-items: center;
  padding: 0.2rem 0.65rem;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.3;
  white-space: nowrap;
}
.kpi-status-progress {
  background: #E6F7F5;
  color: #0086A0;
}
.kpi-status-done {
  background: #E6F7F5;
  color: #006A80;
}
.kpi-row-clickable {
  cursor: pointer;
}

/* KGI / KPI board: one shared header, typed cards */
.kpi-page:not(.kpi-manage-page) {
  --kpi-level-group: #4CBBB4;
  --kpi-level-company: #0086A0;
  --kpi-level-department: #006A80;
  --kpi-level-personal: #E8A32D;
}
.kpi-board {
  --kpi-col-org: minmax(12rem, 1.35fr);
  --kpi-col-kgi: minmax(9rem, 1.2fr);
  --kpi-col-period: minmax(11.5rem, 1.1fr);
  --kpi-col-num: minmax(5.75rem, 0.75fr);
  --kpi-col-actual: minmax(6.5rem, 0.9fr);
  --kpi-col-progress: minmax(8rem, 1fr);
  --kpi-col-ops: 3.25rem;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.kpi-board-head,
.kpi-board-row {
  display: grid;
  grid-template-columns:
    var(--kpi-col-org)
    var(--kpi-col-kgi)
    var(--kpi-col-period)
    var(--kpi-col-num)
    var(--kpi-col-actual)
    var(--kpi-col-progress)
    var(--kpi-col-ops);
  align-items: center;
  column-gap: 0.75rem;
  padding-left: 1.25rem;
  padding-right: 1.15rem;
}
.kpi-board-row {
  padding-top: 0.7rem;
  padding-bottom: 0.7rem;
}
/* Keep top-level cards equal height whether KGI/progress/actions are filled or empty */
.kpi-board-card > .kpi-board-row {
  min-height: 3.4rem;
  box-sizing: border-box;
}
.kpi-board-head {
  background: #e4e8e5;
  border-radius: 0;
  border: 1px solid transparent;
  border-left: 4px solid transparent;
  color: #333;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.35;
  white-space: nowrap;
  padding-top: 0.45rem;
  padding-bottom: 0.45rem;
  min-height: 2.25rem;
  box-sizing: border-box;
}
.kpi-board-head > div:nth-child(n+4):not(:nth-child(7)) {
  text-align: left;
}
.kpi-board-head > div:last-child,
.kpi-board-ops {
  text-align: center;
}
.kpi-board-list {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.kpi-board-card {
  background: #fff;
  border: 1px solid #e8ece9;
  border-radius: 12px;
  box-shadow: 0 4px 18px rgba(16, 24, 40, 0.06);
  overflow: hidden;
  border-left-width: 4px;
  border-left-style: solid;
}
.kpi-board-card.kpi-level-group { border-left-color: var(--kpi-level-group); }
.kpi-board-card.kpi-level-company { border-left-color: var(--kpi-level-company); }
.kpi-board-card.kpi-level-department { border-left-color: var(--kpi-level-department); }
.kpi-board-card.kpi-level-personal { border-left-color: var(--kpi-level-personal); }
.kpi-board-card.is-open {
  box-shadow: 0 6px 22px rgba(16, 24, 40, 0.08);
}
.kpi-board-cell {
  min-width: 0;
  font-size: 13px;
  color: #333;
}
.kpi-board-org {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  min-width: 0;
}
.kpi-level-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.25rem;
  height: 1.25rem;
  flex-shrink: 0;
  border-radius: 0;
  font-size: 1.05rem;
  background: transparent;
  padding: 0;
  line-height: 1;
}
.kpi-level-icon .kpi-level-app-icon.app-icon,
.kpi-level-icon .app-icon.kpi-level-app-icon {
  width: 1.25rem;
  height: 1.25rem;
  object-fit: contain;
  display: block;
}
.kpi-level-group .kpi-level-icon,
.kpi-level-company .kpi-level-icon,
.kpi-level-department .kpi-level-icon,
.kpi-level-personal .kpi-level-icon {
  background: transparent;
  color: inherit;
}
.kpi-level-name {
  min-width: 0;
  font-weight: 700;
  color: #333;
  line-height: 1.4;
  white-space: normal;
  overflow-wrap: anywhere;
}
.kpi-board-kgi {
  font-weight: 600;
  color: #333;
  line-height: 1.4;
  white-space: normal;
  overflow-wrap: anywhere;
}
.kpi-board-period {
  white-space: nowrap;
}
.kpi-board-target {
  font-weight: 700;
  color: #4CBBB4;
}
.kpi-board-expand {
  border-top: 1px solid #eef1ee;
  background: #f7f9f7;
  padding: 0;
}

/* 実績確認（組織図ツリー） */
.kpi-review-page .kpi-review-lead {
  font-size: 13px;
  margin-bottom: 0.85rem;
}
/* Keep column positions stable when +/− expands the list (scrollbar would otherwise shrink width). */
.main-content:has(.kpi-review-page) {
  scrollbar-gutter: stable;
}
.kpi-review-board {
  --kpi-col-org: minmax(15rem, 1.05fr);
  --kpi-col-kgi: minmax(13.5rem, 2.4fr);
  --kpi-col-num: 5.75rem;
  --kpi-col-actual: 5.75rem;
  --kpi-col-progress: 7.5rem;
  --kpi-col-updated: 6.5rem;
  --kpi-col-ops: 2.15rem;
  min-width: 0;
  width: 100%;
  max-width: 100%;
}
.kpi-review-head,
.kpi-review-row,
.kpi-review-page .kpi-review-nested-head,
.kpi-review-page .kpi-review-expand > .kpi-nested-row {
  grid-template-columns:
    var(--kpi-col-org)
    var(--kpi-col-kgi)
    var(--kpi-col-num)
    var(--kpi-col-actual)
    var(--kpi-col-progress)
    var(--kpi-col-updated)
    var(--kpi-col-ops);
  column-gap: 0.55rem;
  align-items: center;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
  padding-right: 0.65rem;
}
.kpi-review-head > div,
.kpi-review-row > .kpi-board-cell {
  min-width: 0;
}
.kpi-review-head > div:last-child {
  text-align: right;
}
.kpi-review-head > div:nth-child(6),
.kpi-review-row .kpi-review-updated,
.kpi-review-page .kpi-review-expand .kpi-review-updated {
  padding-left: 0;
  justify-content: flex-start;
}
.kpi-review-node {
  margin-left: 0;
  width: 100%;
  box-sizing: border-box;
}
.kpi-review-node .kpi-review-expand {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 0;
  background: #f7f9f7;
}
.kpi-review-node .kpi-review-expand > .kpi-review-node {
  margin-left: 0;
  border-radius: 10px;
}
.kpi-review-org {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  min-width: 0;
  padding-left: calc(0.15rem + var(--kpi-review-depth, 0) * 0.75rem);
}
.kpi-review-org-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 1.25rem;
  width: 1.25rem;
  height: 1.25rem;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #6b7280;
  line-height: 1;
  padding: 0;
  margin: 0;
  cursor: pointer;
  position: relative;
}
.kpi-review-org-toggle:hover {
  background: transparent;
  color: #333;
}
.kpi-review-org-toggle .bi {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  line-height: 1;
  width: 100%;
  height: 100%;
}
.kpi-review-org-toggle-spacer {
  display: inline-block;
  flex: 0 0 1.25rem;
  width: 1.25rem;
  height: 1.25rem;
}
.kpi-review-page .kpi-review-row > .kpi-board-cell {
  display: flex;
  align-items: center;
  min-height: 2rem;
}
.kpi-review-page .kpi-review-row > .kpi-board-ops {
  justify-content: flex-end;
}
.kpi-review-empno {
  font-weight: 500;
  color: #6b7280;
  font-size: 12px;
}
.kpi-review-updated {
  color: #333;
  white-space: nowrap;
}
.kpi-review-updated.is-stale {
  color: #D49A1A;
  font-weight: 600;
}
.kpi-review-empty {
  background: #fff;
  border: 1px solid #e8ece9;
  border-radius: 12px;
  padding: 1.25rem;
  text-align: center;
  font-size: 13px;
}
.kpi-page .kpi-actual-review-btn {
  white-space: nowrap;
}
@media (max-width: 900px) {
  .kpi-review-page .kpi-review-head {
    display: none;
  }
  .kpi-review-head,
  .kpi-review-row,
  .kpi-review-page .kpi-review-nested-head,
  .kpi-review-page .kpi-review-expand > .kpi-nested-row {
    grid-template-columns: 1fr;
  }
  .kpi-review-org {
    padding-left: calc(0.1rem + var(--kpi-review-depth, 0) * 0.5rem);
  }
}

.kpi-nested-head {
  background: #eef2ef;
  color: #4b5563;
  font-size: 12px;
  font-weight: 700;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}
.kpi-nested-row {
  background: #fff;
  border-top: 1px solid #f0f1f3;
}
.kpi-nested-row:last-child {
  border-bottom: none;
}
.kpi-nested-empty {
  padding: 0.85rem 1.25rem;
  text-align: center;
  font-size: 13px;
}
.kpi-personal-header .kpi-board-org {
  grid-column: 1 / -1;
  width: 100%;
}
.kpi-personal-header:has(.kpi-personal-ops-only) .kpi-board-org {
  grid-column: 1 / -2;
}
.kpi-personal-header .kpi-personal-ops-only {
  grid-column: -2 / -1;
  justify-self: end;
}
.kpi-personal-create-btn {
  margin-left: auto;
  flex-shrink: 0;
}
.kpi-personal-create-outside {
  display: flex;
  justify-content: flex-end;
  align-self: flex-end;
  width: 100%;
  margin: 0.15rem 0 0.25rem;
  padding: 0;
}
.kpi-personal-create-outside .btn {
  margin-left: auto;
  flex-shrink: 0;
}
.kpi-personal-create {
  display: flex;
  justify-content: flex-end;
  padding: 0.7rem 1.15rem 0.85rem;
  border-top: 1px solid #eef1ee;
  background: #fff;
}
.kpi-personal-row {
  border-top: 1px solid #f0f1f3;
}
.kpi-personal-repeat {
  padding-left: calc(2.15rem + 0.7rem);
  font-weight: 600;
  color: #6b7280;
}
.kpi-nested-ksf {
  font-weight: 700;
  color: #333;
  line-height: 1.4;
  white-space: normal;
  overflow-wrap: anywhere;
}
.kpi-nested-kpi {
  font-weight: 500;
  color: #333;
  line-height: 1.4;
  white-space: normal;
  overflow-wrap: anywhere;
}
/* Tablets (incl. iPad landscape + sidebar): the whole board scrolls sideways; cards clip their own overflow */
@media (min-width: 768px) and (max-width: 1279.98px) {
  .kpi-board:not(.kpi-review-board) {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .kpi-board:not(.kpi-review-board) > .kpi-board-head,
  .kpi-board:not(.kpi-review-board) > .kpi-board-list {
    min-width: 64rem;
  }
}
@media (max-width: 991.98px) {
  .kpi-review-board {
    overflow-x: hidden;
  }
  .kpi-review-head,
  .kpi-review-row,
  .kpi-review-page .kpi-review-nested-head,
  .kpi-review-page .kpi-review-expand > .kpi-nested-row {
    min-width: 0;
  }
}
@media (max-width: 767.98px) {
  .kpi-board {
    overflow-x: visible;
    gap: 0.85rem;
  }
  .kpi-board-head {
    display: none;
  }
  .kpi-nested-head {
    display: none;
  }
  .kpi-board-row {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    min-width: 0;
    padding: 0.85rem 1rem 0.75rem;
    gap: 0;
  }
  .kpi-board-cell {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.45rem 0;
    border-bottom: 1px solid #f3f4f6;
    white-space: normal;
  }
  .kpi-board-cell::before {
    content: attr(data-label);
    flex: 0 0 auto;
    max-width: 42%;
    color: #333;
    font-size: 13px;
    font-weight: 700;
  }
  .kpi-board-org {
    display: flex;
    padding-bottom: 0.7rem;
    border-bottom: 1px solid #eef1ee;
  }
  .kpi-board-org::before {
    content: none;
  }
  .kpi-level-name {
    white-space: normal;
  }
  .kpi-board-kgi {
    white-space: normal;
  }
  .kpi-board-ops {
    justify-content: flex-end;
    border-bottom: none;
    padding-top: 0.7rem;
  }
  .kpi-board-ops::before {
    content: none;
  }
  .kpi-personal-repeat {
    padding-left: 0;
  }
  .kpi-personal-header .kpi-board-org {
    flex-wrap: wrap;
    gap: 0.5rem 0.7rem;
  }
  .kpi-personal-create-btn {
    margin-left: 0;
    width: 100%;
  }
  .kpi-personal-create-outside {
    justify-content: flex-end;
  }
  .kpi-personal-create-outside .btn {
    width: auto;
  }
  .kpi-nested-ksf,
  .kpi-nested-kpi {
    white-space: normal;
    overflow: visible;
    text-overflow: unset;
  }
}

/* Inbox / お知らせ — row behavior only; padding/align from shared .list-table */
.inbox-table tbody tr {
  cursor: pointer;
  transition: background-color 0.12s ease;
}
.inbox-table tbody tr:hover > * {
  background-color: #f7faf7 !important;
}
.inbox-table tbody tr.is-read > * {
  background-color: transparent;
}
.inbox-table tbody tr.is-selected > *,
.inbox-table tbody tr.is-selected:hover > * {
  --bs-table-bg-state: #e8f6e4;
  background-color: #e8f6e4 !important;
}
.inbox-period {
  font-size: inherit;
  color: #4b5563;
}
.inbox-title {
  font-size: inherit;
  font-weight: 500;
  color: #333;
  line-height: 1.4;
}
.inbox-title.is-read {
  font-weight: 400;
  color: #6b7280;
}
.inbox-attach-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 0.375rem;
  color: #4CBBB4;
  text-decoration: none;
  font-size: 1.15rem;
  line-height: 1;
  transition: background-color 0.12s ease, color 0.12s ease;
}
.inbox-attach-link:hover {
  background: #eaf7e8;
  color: #3AA99C;
}
.inbox-action-btn {
  min-width: 4.5rem;
  min-height: 2.35rem;
  border-radius: var(--shell-btn-radius) !important;
  font-weight: var(--shell-btn-font-weight) !important;
  font-size: var(--shell-btn-font-size) !important;
  padding: var(--shell-btn-padding-y) var(--shell-btn-padding-x) !important;
  border: none !important;
}
.inbox-action-btn.is-pending {
  background: #4CBBB4 !important;
  color: #fff !important;
}
.inbox-action-btn.is-pending:hover {
  background: #3AA99C !important;
  color: #fff !important;
}
.inbox-action-btn.is-done {
  background: #9ca3af !important;
  color: #fff !important;
}
.notice-detail-meta {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  line-height: 1.45;
}
.inbox-action-btn.is-done:hover {
  background: #6b7280 !important;
  color: #fff !important;
}

/* Tasks page — row behavior only; padding/align from shared .list-table */
.task-manage-table tbody tr {
  cursor: pointer;
  transition: background-color 0.12s ease;
}
.task-manage-table tbody tr:hover > * {
  background-color: #f7faf7 !important;
}
.task-manage-table tbody tr.is-selected > *,
.task-manage-table tbody tr.is-selected:hover > * {
  --bs-table-bg-state: #e8f6e4;
  background-color: #e8f6e4 !important;
}
.task-manage-table tbody tr.is-done .task-cell-content,
.task-manage-table tbody tr.is-done .task-cell-content .task-title,
.task-manage-table tbody tr.is-done .task-cell-content .task-desc {
  color: #9ca3af;
  text-decoration: line-through;
}
.task-manage-table tbody tr.is-done .task-cell-content .task-title {
  font-weight: 400;
}
.task-due {
  font-size: inherit;
  color: #4b5563;
}
.task-title {
  font-size: inherit;
  font-weight: 400;
  color: #333;
  line-height: 1.4;
}
.task-cell-content .task-desc {
  margin-top: 0.15rem;
}
.task-manage-table .form-check-input {
  width: 1.1rem;
  height: 1.1rem;
  cursor: pointer;
  accent-color: #4CBBB4;
}

/* Domain badges (not Bootstrap text-bg variants) */
.badge-company { background: #1e3a5f; color: #fff; }
.badge-dept { background: #E6F7F5; color: var(--hirakumo-accent2); }
.badge-hr { background: #E6F7F5; color: #0086A0; }
.task-pri {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.6rem;
  padding: 0.15rem 0.45rem;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 600;
  white-space: nowrap;
}
/* Shared list status / category pills — same size on お知らせ・動画・評価 etc. */
.list-table .badge,
.notice-admin-table .badge,
.inbox-page .list-table .badge,
.dash-cards .badge,
.badge.badge-company,
.badge.badge-dept,
.badge.badge-hr {
  font-size: 14px;
  font-weight: 600;
  line-height: 1.25;
  padding: 0.35em 0.7em;
  vertical-align: middle;
}
.dest-field-summary .badge,
.dest-selected-chips .badge {
  font-size: 14px;
  font-weight: 600;
}
.task-pri-high { background: #FDECEC; color: #B81C22; }
.task-pri-mid { background: #FFF7EB; color: #92400e; }
.task-pri-low { background: #E5E7EB; color: #4b5563; }

.task-due-tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.6rem;
  padding: 0.15rem 0.45rem;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 600;
  white-space: nowrap;
}
.task-due-overdue { background: #FDECEC; color: #B81C22; }
.task-due-today { background: #FFF7EB; color: #92400e; }
.task-due-later { background: #fff; color: #333; }

/* Tasks month calendar — reuse jm-month; light done styling only */
.task-month .task-month-event--done {
  background: #D1FAE5 !important;
}
.task-month .jm-month-events .jm-event {
  margin-bottom: 2px;
}
.sch-event-pop-row.task-event-pop-row--start {
  grid-template-columns: 4.5em auto 1fr auto;
  align-items: center;
}
.task-event-pop-done {
  justify-self: end;
  white-space: nowrap;
  margin-left: 0.5rem;
  flex-direction: row;
  cursor: pointer;
}
.task-event-pop-done .form-check-input {
  float: none;
  margin: 0;
  cursor: pointer;
}
.task-event-pop-done.is-done {
  color: #047857;
}
.task-event-pop-done.is-done .form-check-input {
  background-color: #10b981;
  border-color: #059669;
}
.task-event-pop-head--done {
  color: #065f46;
}

/* Schedule / facility week grid */
.jm-grid { width: 100%; border-collapse: collapse; background: #fff; table-layout: fixed; min-width: 64rem; }
.jm-grid td[colspan] {
  width: 100%;
  max-width: none;
  min-width: 0;
  text-align: center;
  vertical-align: middle;
}
.jm-grid th, .jm-grid td { border: 0.5px solid #e0e0e0; vertical-align: top; }
.jm-grid th {
  background: #fff;
  font-size: var(--type-body);
  font-weight: var(--type-weight-regular);
  padding: 6px 8px;
  text-align: center;
  color: var(--hirakumo-ink);
}
.jm-grid th:not(.jm-corner),
.jm-grid td.jm-cell {
  min-width: 7.1rem;
}
.jm-corner,
.jm-row-label {
  /* Narrow sticky label: JP names like 「清水石 怜子」 fit; longer/katakana wrap to 2 lines */
  width: 8.5rem;
  min-width: 8.5rem;
  max-width: 8.5rem;
  background: #f8f9fa;
  font-size: var(--type-body);
  padding: 8px 6px 8px 8px;
  text-align: left;
  vertical-align: middle;
  overflow: hidden;
}
.jm-row-label {
  background: #fff;
}
.jm-row-label.jm-me {
  background: #fff;
}
.jm-fac-cell {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  gap: 4px;
  min-width: 0;
  width: 100%;
}
.jm-fac-info {
  min-width: 0;
  flex: 1 1 auto;
}
.jm-fac-name,
.jm-fac-sub {
  overflow: visible;
}
.jm-fac-name {
  font-size: var(--type-body);
  font-weight: var(--type-weight-regular);
  line-height: 1.35;
  color: var(--hirakumo-ink);
  overflow: visible;
  margin: 0;
  padding: 0;
  text-align: left;
  white-space: normal;
  word-break: keep-all;
  overflow-wrap: break-word;
  line-break: strict;
}
.jm-fac-name--has-sub {
  /* Same wrap rules — long main names go to the next line at word boundaries */
  white-space: normal;
  text-overflow: unset;
  word-break: keep-all;
  overflow-wrap: break-word;
  line-break: strict;
}
.jm-fac-sub {
  margin: 2px 0 0;
  padding: 0;
  /* Halfwidth "(" looks indented — pull flush with the main name */
  text-indent: -0.28em;
  font-size: var(--type-caption);
  font-weight: var(--type-weight-regular);
  line-height: 1.35;
  color: var(--hirakumo-muted);
  text-align: left;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  overflow-wrap: normal;
  word-break: keep-all;
}

/* Mobile: keep 氏名 / 設備名 fully readable while week days scroll */
@media (max-width: 767.98px) {
  .jm-grid {
    min-width: 58rem;
  }
  .jm-corner,
  .jm-row-label {
    width: 8.5rem;
    min-width: 8.5rem;
    max-width: 8.5rem;
    padding: 10px 8px 10px 12px;
  }
  .jm-user-name,
  .jm-fac-name {
    white-space: normal;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    text-overflow: unset;
    word-break: keep-all;
    overflow-wrap: break-word;
    line-break: strict;
  }
  .jm-user-meta {
    white-space: normal;
    overflow: visible;
    text-overflow: unset;
    overflow-wrap: anywhere;
    word-break: break-word;
    padding-right: 0;
  }
  .jm-fac-sub {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    overflow-wrap: normal;
    word-break: keep-all;
    text-indent: -0.28em;
  }
  .jm-user-icons {
    width: 24px;
    height: 24px;
    min-width: 24px;
  }
  .jm-user-icons .jm-view-cal-icon,
  .jm-view-cal-icon {
    width: 24px;
    height: 24px;
  }
}
@media (max-width: 575.98px) {
  .jm-grid {
    min-width: 52rem;
  }
  .jm-corner,
  .jm-row-label {
    width: 7rem;
    min-width: 7rem;
    max-width: 7rem;
    padding: 8px 6px 8px 8px;
  }
  .jm-grid th:not(.jm-corner),
  .jm-grid td.jm-cell {
    min-width: 6.5rem;
  }
}


/* Week / month period nav: reserve the longest label width, hug the buttons.
   Match calendar header date typography (.jm-grid th). */
.jm-date-range {
  position: relative;
  flex: 0 0 auto;
  white-space: nowrap;
  font-size: var(--type-body);
  font-weight: var(--type-weight-regular);
  line-height: 1.2;
  color: var(--hirakumo-ink);
}
.jm-date-range-sizer {
  visibility: hidden;
  display: block;
  pointer-events: none;
}
.jm-date-range-value {
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}
.jm-date-range + .jm-period-nav {
  margin-left: 0.85rem;
}
.jm-period-nav {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  flex-shrink: 0;
}
.jm-period-arrow,
.jm-period-btn,
.btn.jm-period-arrow,
.btn.jm-period-btn {
  width: 1.85rem !important;
  height: 1.85rem !important;
  min-width: 1.85rem !important;
  min-height: 1.85rem !important;
  padding: 0 !important;
  font-size: 0.75rem !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 4px !important;
  border-color: #d1d5db !important;
  color: #333 !important;
  background: #fff !important;
  white-space: nowrap;
  box-shadow: none;
  transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
.jm-period-arrow .bi,
.jm-period-btn .bi {
  display: block;
  line-height: 1;
  font-size: 0.85rem;
}
.jm-period-today,
.btn.jm-period-today {
  width: auto !important;
  min-width: 2.4rem !important;
  padding: 0 0.45rem !important;
  font-size: 0.78rem !important;
  font-weight: 400 !important;
}
.jm-period-arrow:hover,
.jm-period-arrow:focus,
.jm-period-btn:hover,
.jm-period-btn:focus {
  background: #f0fdf4 !important;
  border-color: #4CBBB4 !important;
  color: #2086A0 !important;
  box-shadow: none;
}
.jm-period-arrow:active,
.jm-period-btn:active {
  background: #e8f7e4 !important;
  color: #2086A0 !important;
}
.jm-period-label {
  display: inline-block;
  font-size: 0.95rem;
  font-weight: 400;
  color: #333;
  padding: 0 0.35rem;
  text-align: center;
  line-height: 1.2;
  user-select: none;
}
.jm-dept-select {
  min-width: 16rem;
  max-width: min(100%, 32rem);
  field-sizing: content;
}
.jm-grid-block {
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.jm-org-filter-row {
  width: 100%;
  /* Filter → calendar: same 8px rhythm on スケジュール / 設備予約 */
  margin-bottom: 0.5rem; /* --space 8px */
}
.jm-org-filter-label {
  font-size: 0.875rem;
  color: #333;
  flex-shrink: 0;
}
.jm-org-filter-btn,
.jm-org-filter-select {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  flex-shrink: 0;
  min-width: 8.5rem;
  height: 2rem;
  padding: 0.2rem 0.65rem;
  font-size: 0.875rem;
  font-weight: 400;
  line-height: 1.5;
  color: #333;
  background: #fff;
  border: 1px solid #ced4da;
  border-radius: 0.375rem;
  appearance: none;
}
.jm-org-filter-btn > .bi {
  font-size: 1rem;
  line-height: 1;
  color: #495057;
}
.jm-org-filter-btn .jm-org-filter-icon.app-icon,
.jm-org-filter-btn .app-icon.jm-org-filter-icon {
  width: 1.05rem;
  height: 1.05rem;
  flex-shrink: 0;
  display: block;
}
.jm-org-filter-btn.is-active {
  border-color: var(--hirakumo-brand);
  background: var(--hirakumo-focus-fill);
  color: var(--hirakumo-brand-active);
}
.jm-org-filter-btn.is-active > .bi {
  color: var(--hirakumo-brand);
}
.jm-org-filter-select {
  justify-content: space-between;
  padding-right: 1.75rem;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%236c757d' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: right 0.55rem center;
  background-size: 0.7rem;
}
.jm-org-filter-btn:hover,
.jm-org-filter-btn:focus,
.jm-org-filter-select:hover,
.jm-org-filter-select:focus {
  color: #333;
  background-color: #fff;
  border-color: #adb5bd;
  box-shadow: none;
  outline: none;
}
.jm-org-filter-btn.is-active:hover,
.jm-org-filter-btn.is-active:focus {
  color: var(--hirakumo-brand-active);
  background: var(--hirakumo-focus-fill);
  border-color: var(--hirakumo-brand);
}
.jm-org-filter-current {
  font-weight: 400 !important;
  font-size: 0.9rem;
  color: #333;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.jm-user-cell {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  gap: 4px;
  width: 100%;
  min-width: 0;
}
.jm-user-name {
  flex: 1 1 auto;
  min-width: 0;
  font-size: var(--type-body);
  font-weight: var(--type-weight-regular);
  line-height: 1.35;
  color: var(--hirakumo-ink);
  cursor: default;
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  white-space: normal;
  /* Prefer break at spaces (トゥレイン / トゥン); mid-word only if one token is too long */
  word-break: keep-all;
  overflow-wrap: break-word;
  line-break: strict;
}
.jm-user-meta {
  margin-top: 4px;
  font-size: var(--type-caption);
  font-weight: var(--type-weight-regular);
  line-height: 1.4;
  color: var(--hirakumo-muted);
  overflow-wrap: anywhere;
  word-break: break-word;
}
.jm-user-icons {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  min-width: 26px;
  margin-left: auto;
  padding: 0 !important;
  font-size: 12px !important;
  line-height: 1 !important;
  color: #4CBBB4;
  border-radius: 4px;
  cursor: pointer;
  user-select: none;
  flex-shrink: 0;
  border: none;
  background: transparent;
  text-decoration: none !important;
}
.jm-user-icons:hover { background: #f0f9ec; }
.jm-cell {
  min-height: 96px;
  height: auto;
  /* Events flush to cell edges; bottom pad reserved for dblclick-to-add */
  padding: 0 0 44px !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  font-size: var(--type-other);
  font-weight: var(--type-weight-regular);
  vertical-align: top;
}
.jm-grid td.jm-cell,
.jm-grid td.jm-sch-cell {
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.jm-sch-cell {
  position: relative;
}

/* Week row: multi-day / consecutive 不定期 bars in-flow (row grows; no bleed into next person) */
.jm-week-track-cell,
.jm-grid td.jm-week-track-cell[colspan] {
  padding: 0 !important;
  vertical-align: top !important;
  text-align: left !important; /* override .jm-grid td[colspan] { text-align: center } */
  overflow: hidden;
}
.jm-week-track {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 96px;
  width: 100%;
  overflow: hidden;
  /* Multi-day / 不定期 folded bars: match single-line day chip height for bottom align */
  --jm-span-chip-h: calc((var(--type-other) * 1.5) + 8px);
  --jm-span-lane-h: calc(var(--jm-span-chip-h) + 4px);
  /* Full-height day column lines behind span + day content */
  background-image: repeating-linear-gradient(
    to right,
    transparent 0,
    transparent calc(100% / 7 - 1px),
    #d8dbe2 calc(100% / 7 - 1px),
    #d8dbe2 calc(100% / 7)
  );
}
/* Overlay: multi-day bars sit on top; per-day padding-top reserves space only where covered */
.jm-week-spans {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  column-gap: 0;
  row-gap: 0;
  width: 100%;
  pointer-events: none;
}
.jm-week-span {
  z-index: 2;
  min-width: 0;
  align-self: start;
  cursor: pointer;
  pointer-events: auto;
  box-sizing: border-box;
}
/*
 * Beat .jm-event { display:block; overflow:visible; white-space:normal } so every
 * multi-day / 不定期 bar keeps the same chip height (long titles must not wrap taller).
 */
.jm-week-span.jm-event {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  height: var(--jm-span-chip-h) !important;
  min-height: var(--jm-span-chip-h) !important;
  max-height: var(--jm-span-chip-h) !important;
  padding-top: 0.2rem !important;
  padding-bottom: 0.2rem !important;
  line-height: 1.25 !important;
  overflow: hidden !important;
  white-space: nowrap !important;
  text-align: left !important;
}
.jm-week-span.jm-event .jm-ev-title,
.jm-week-span.jm-event .jm-ev-time {
  display: block !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
  min-width: 0;
  text-align: left !important;
  line-height: 1.25 !important;
}
.jm-week-span.jm-event .jm-ev-all-day {
  display: flex !important;
  width: 100%;
  min-width: 0;
  min-height: 0;
  align-items: center !important;
  justify-content: flex-start;
  overflow: hidden;
  gap: 0.35rem;
}
.jm-week-span.jm-event .jm-ev-24h {
  width: 1.1rem;
  height: 1.1rem;
  margin-top: 0;
}
.jm-week-span.jm-event .jm-ev-24-icon,
.jm-week-span.jm-event .jm-ev-24h .jm-ev-24-icon.app-icon,
.jm-week-span.jm-event .jm-ev-24h .app-icon.jm-ev-24-icon {
  width: 1.1rem;
  height: 1.1rem;
}
.jm-week-day-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  width: 100%;
  flex: 1 1 auto;
  min-height: 0;
}
.jm-week-day-col {
  min-height: 52px;
  height: auto;
  padding: 0 0 44px !important;
  border-right: 0;
  box-sizing: border-box;
  text-align: left;
}
.jm-week-day-col:hover {
  outline: 2px solid #A8DCE1;
  outline-offset: -2px;
  z-index: 1;
}
/* Reserves vertical room under multi-day bars only on days those bars cover */
.jm-week-day-span-spacer {
  display: block;
  width: 100%;
  flex-shrink: 0;
  pointer-events: none;
}
.jm-module--week .jm-week-track-cell {
  border-right: 1px solid #d8dbe2;
}
.jm-module--week .jm-week-user-row > td {
  border-bottom: 0.5px solid #e0e0e0;
}
.jm-sun { color: var(--hirakumo-danger); }
.jm-sat { color: var(--hirakumo-accent2); }
.jm-holiday { color: var(--hirakumo-danger); }
.jm-grid th.jm-sun,
.jm-grid .jm-month-date.jm-sun { color: var(--hirakumo-danger) !important; }
.jm-grid th.jm-sat,
.jm-grid .jm-month-date.jm-sat { color: var(--hirakumo-accent2) !important; }
.jm-grid th.jm-holiday,
.jm-grid .jm-month-date.jm-holiday { color: var(--hirakumo-danger) !important; }
/* Week header row: white fill; today uses soft brand tint (same as month) */
.jm-grid th.jm-sun,
.jm-grid th.jm-sat,
.jm-grid th.jm-holiday {
  background: #fff !important;
}
.jm-grid th.jm-today {
  background: var(--hirakumo-focus-fill) !important;
}
.jm-grid th.jm-today.jm-sun,
.jm-grid th.jm-today.jm-holiday { color: var(--hirakumo-danger) !important; }
.jm-grid th.jm-today.jm-sat { color: var(--hirakumo-accent2) !important; }
.jm-grid th.jm-today:not(.jm-sun):not(.jm-sat):not(.jm-holiday) {
  color: var(--hirakumo-brand-active);
}
.jm-view-icon-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 2px 4px !important;
  line-height: 1;
}
.jm-view-cal-icon {
  display: block;
  width: 26px;
  height: 26px;
  object-fit: contain;
}
.jm-user-icons .jm-view-cal-icon,
.jm-user-icons .app-icon.jm-view-cal-icon {
  width: 26px;
  height: 26px;
}
.jm-event {
  display: block;
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  border-radius: 5px;
  padding: 4px 6px;
  margin: 0 0 4px;
  overflow: visible;
  white-space: normal;
  text-align: left;
  font-size: var(--type-other);
  font-weight: var(--type-weight-regular);
  line-height: 1.5;
  color: #333;
  background-color: var(--hirakumo-focus-fill);
  /* No stroke — light shadow keeps white/pale chips readable on the cell. */
  border: 0;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.12), 0 0 0 1px rgba(15, 23, 42, 0.04);
}
.jm-event .jm-ev-title,
.jm-event .jm-ev-time,
.jm-cell .jm-event,
.jm-week-day-col .jm-event {
  text-align: left;
}
/* Week day chips + 不定期 spans: leave 1px on the right so the day divider stays visible.
   Must beat .jm-event { width: 100% } or margin-right overflows and covers the border. */
.jm-week-day-col .jm-event,
.jm-week-span.jm-event {
  margin: 0 1px 4px 0 !important;
  width: calc(100% - 1px);
  max-width: calc(100% - 1px);
  box-sizing: border-box;
}
.jm-cell .jm-event:last-child,
.jm-month-events .jm-event:last-child {
  margin-bottom: 0;
}
.jm-event .jm-ev-time,
.jm-event .jm-ev-title,
.jm-month-events .jm-event .jm-ev-time,
.jm-month-events .jm-event .jm-ev-title {
  color: #333;
}
.jm-event .jm-ev-time,
.jm-month-events .jm-event .jm-ev-time {
  font-weight: var(--type-weight-bold);
}
.jm-event .jm-ev-title,
.jm-month-events .jm-event .jm-ev-title {
  font-weight: var(--type-weight-regular);
}
.jm-event.jm-event--other {
  /* kept for backward compat; colors now come from 予定内容 */
  color: inherit;
}
.jm-ev-time {
  display: block;
  font-weight: var(--type-weight-bold);
  white-space: nowrap;
  margin-bottom: 0.2rem;
}
.jm-ev-all-day {
  display: flex;
  align-items: flex-start;
  gap: 0.4rem;
  min-width: 0;
}
.jm-ev-24h {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  line-height: 1;
  width: 1.35rem;
  height: 1.35rem;
  margin-top: 0.1rem;
}
.jm-ev-24-icon,
.jm-ev-24h .jm-ev-24-icon.app-icon,
.jm-ev-24h .app-icon.jm-ev-24-icon {
  width: 1.35rem;
  height: 1.35rem;
  flex-shrink: 0;
  display: block;
  /* white/whole_day.png is a light glyph — invert so it reads on pastel event chips */
  filter: invert(1);
}
.jm-event--all-day .jm-ev-title {
  display: block;
  min-width: 0;
  flex: 1 1 auto;
}
.jm-ev-title {
  display: block;
  overflow: visible;
  white-space: normal;
  overflow-wrap: break-word;
  word-break: break-word;
  text-overflow: unset;
}

/* Schedule event single-click detail balloon */
.sch-event-pop-layer {
  position: fixed;
  inset: 0;
  z-index: 1080;
  pointer-events: none;
}
.sch-event-pop-backdrop {
  position: absolute;
  inset: 0;
  pointer-events: auto;
  background: transparent;
}
.sch-event-pop {
  position: fixed;
  z-index: 1081;
  pointer-events: auto;
  width: min(320px, calc(100vw - 24px));
  filter: drop-shadow(0 2px 8px rgba(15, 23, 42, 0.18));
  display: flex;
  flex-direction: column;
}
.sch-event-pop--above {
  flex-direction: column;
}
.sch-event-pop--below {
  flex-direction: column-reverse;
}
.sch-event-pop-arrow {
  width: 0;
  height: 0;
  margin-left: var(--sch-pop-arrow-x, 18px);
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  --sch-pop-arrow: #f8d7da;
}
/* JMotto-style: popover above the block → arrow points down at the event */
.sch-event-pop--above .sch-event-pop-arrow {
  border-top: 9px solid var(--sch-pop-arrow);
  border-bottom: 0;
}
.sch-event-pop--below .sch-event-pop-arrow {
  border-bottom: 9px solid var(--sch-pop-arrow);
  border-top: 0;
}
.sch-event-pop-card {
  border: 0;
  border-radius: 2px;
  background: #fff;
  overflow: hidden;
}
.sch-event-pop-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 0.55rem 0.75rem;
  font-size: 0.92rem;
  font-weight: 700;
  line-height: 1.4;
  color: #333;
  border-bottom: 0;
}
.sch-event-pop-head-title {
  min-width: 0;
  flex: 1 1 auto;
}
.sch-event-pop-close {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: 0;
  width: 1.5rem;
  height: 1.5rem;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #6b7280;
  font-size: 1.35rem;
  font-weight: 400;
  line-height: 1;
  cursor: pointer;
  box-shadow: none;
}
.sch-event-pop-close:hover,
.sch-event-pop-close:focus {
  color: #4b5563;
  background: transparent;
  border: 0;
  outline: none;
  box-shadow: none;
}
.sch-event-pop-body {
  padding: 0.65rem 0.75rem 0.45rem;
  font-size: 0.86rem;
  color: #333;
}
.sch-event-pop-row {
  display: grid;
  grid-template-columns: 4.5em auto 1fr;
  column-gap: 0;
  align-items: start;
  margin-bottom: 0.28rem;
  line-height: 1.45;
}
.sch-event-pop-label {
  color: #333;
  white-space: nowrap;
}
.sch-event-pop-sep {
  color: #333;
}
.sch-event-pop-value {
  min-width: 0;
  word-break: break-word;
}
.sch-event-pop-value--body {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  max-height: 8.5rem;
  overflow-y: auto;
}
.sch-event-pop-value--body a {
  color: var(--hirakumo-brand, #4CBBB4);
  text-decoration: underline;
  word-break: break-all;
}
.sch-event-pop-value--body a:hover {
  color: var(--hirakumo-brand-hover, #3aa39c);
}
/* 不定期: MM/DD 一覧の次の行に 終日 or 時刻を出す */
.sch-event-pop-value--irregular {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.15rem;
}
.sch-event-pop-irregular-dates,
.sch-event-pop-irregular-time {
  display: block;
  width: 100%;
}
.sch-event-pop-irregular-time {
  margin-top: 0;
}
.sch-event-pop-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.55rem;
  padding: 0.35rem 0.75rem 0.65rem;
}
.sch-event-pop-actions-left,
.sch-event-pop-actions-right {
  display: flex;
  align-items: center;
  gap: 0.55rem;
}
.sch-event-pop-actions-right {
  margin-left: auto;
}
.sch-event-pop-link {
  appearance: none;
  border: 0;
  background: transparent;
  padding: 0;
  margin: 0;
  color: var(--hirakumo-brand);
  font-size: 0.86rem;
  line-height: 1.2;
  text-decoration: none;
  cursor: pointer;
}
.sch-event-pop-link:hover,
.sch-event-pop-link:focus {
  color: var(--hirakumo-brand-hover);
  text-decoration: underline;
}
.sch-event-pop-link--danger {
  color: var(--hirakumo-danger);
}
.sch-event-pop-link--danger:hover,
.sch-event-pop-link--danger:focus {
  color: var(--hirakumo-danger-hover);
  text-decoration: underline;
}
.sch-event-pop-divider {
  color: #9ca3af;
  font-size: 0.86rem;
  line-height: 1;
  user-select: none;
}

/* Monthly schedule page (inline, not modal) */
.jm-month-toolbar {
  margin-bottom: 0.5rem !important;
}
.jm-month-toolbar-subject {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  min-width: 0;
  flex: 0 1 auto;
  max-width: 100%;
}
.jm-month-toolbar-name {
  flex: 0 1 auto;
  min-width: 0;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.35;
  color: #333333;
  white-space: nowrap;
}
.jm-month-toolbar .jm-user-icons {
  flex-shrink: 0;
}

/* Week / month calendar (スケジュール / 設備予約):
   One full-page viewport — table scrolls inside; no outer scrollbar for copyright. */
.layout-col:has(.jm-module--week) .main-content,
.layout-col:has(.jm-module--month) .main-content {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  padding-bottom: 0;
}
.layout-col:has(.jm-module--week) .main-content > .page,
.layout-col:has(.jm-module--month) .main-content > .page {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  padding-bottom: 8px;
}
/* Phone: use full width for the grid (drop shell side gutters) */
@media (max-width: 991.98px) {
  .layout-col:has(.jm-module--week) .main-content,
  .layout-col:has(.jm-module--month) .main-content {
    --main-content-pad-x: 0px;
    padding-left: 0;
    padding-right: 0;
  }
  .layout-col:has(.jm-module--week) .main-content > .page,
  .layout-col:has(.jm-module--month) .main-content > .page {
    padding-top: 8px;
    padding-bottom: 0;
  }
  .page-content:has(.jm-module--week),
  .page-content:has(.jm-module--month) {
    padding-left: 0;
    padding-right: 0;
  }
  .jm-module--week > .jm-toolbar,
  .jm-module--month > .jm-toolbar {
    padding-left: 10px;
    padding-right: 10px;
  }
  .jm-module--week > .jm-grid-block > .jm-grid-wrap,
  .jm-module--week > .jm-grid-wrap,
  .jm-module--month > .jm-month-wrap,
  .jm-module--month > #sch-month-wrap,
  .jm-module--month > #fac-month-wrap,
  .jm-module--month > #task-month-wrap {
    border-radius: 0 !important;
  }
}
.layout-col:has(.jm-module--week) .main-content > .site-footer,
.layout-col:has(.jm-module--month) .main-content > .site-footer {
  display: none;
}
.page-content:has(.jm-module--month),
.page-content:has(.jm-module--week) {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  height: auto;
  min-height: 0;
  overflow: hidden;
}
.jm-module--month,
.jm-module--week {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  height: 100%;
}
.jm-module--month > .jm-toolbar,
.jm-module--week > .jm-toolbar {
  flex: 0 0 auto;
  background: var(--shell-page-bg);
  z-index: 4;
}
.jm-module--month > .jm-month-wrap,
.jm-module--month > #sch-month-wrap,
.jm-module--month > #fac-month-wrap,
.jm-module--month > #task-month-wrap {
  flex: 1 1 auto;
  min-height: 0;
  height: 0;
  display: block;
  overflow: auto !important;
  -webkit-overflow-scrolling: touch;
}
.jm-module--week > .jm-grid-block {
  flex: 1 1 auto;
  min-height: 0;
}
.jm-module--week > .jm-grid-block > .jm-grid-wrap,
.jm-module--week > .jm-grid-wrap {
  flex: 1 1 auto;
  min-height: 0;
  height: 0;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}
/* Sticky date header (氏名 / 設備名 + day columns) — same idea as 一覧 sticky-thead */
.jm-module--week .jm-grid {
  border-collapse: separate;
  border-spacing: 0;
}
/* Match monthly: only right/bottom cell lines — no outer frame.
   Day columns always keep a clear vertical grid line. */
.jm-module--week .jm-grid th,
.jm-module--week .jm-grid td {
  border-top: 0;
  border-left: 0;
  border-right: 1px solid #d8dbe2;
  border-bottom: 0.5px solid #e0e0e0;
}
.jm-module--week .jm-grid tr > :first-child {
  border-left: 0;
}
.jm-module--week .jm-grid thead th {
  position: sticky;
  top: 0;
  z-index: 20;
  background: #fff;
  border-top: 0;
  /* Soft lift so the sticky date header stays readable over scrolling cells */
  box-shadow: 0 3px 8px rgba(15, 23, 42, 0.1);
}
/* 氏名 / 設備名 stay pinned while the day columns scroll horizontally */
.jm-module--week .jm-grid th.jm-corner {
  left: 0;
  z-index: 21;
  background: #fff;
  box-shadow: 0 3px 8px rgba(15, 23, 42, 0.1);
}
.jm-module--week .jm-grid td.jm-row-label {
  position: sticky;
  left: 0;
  z-index: 10;
}
.jm-module--week .jm-grid-wrap,
.jm-module--month .jm-month-wrap {
  touch-action: manipulation;
}
.jm-module--week .jm-grid-wrap,
.jm-module--month .jm-month-wrap {
  border: 0.5px solid #e0e0e0 !important;
  border-radius: 0 !important;
}
/* Month: top edge lives on the sticky weekday row so scrolled chips cannot peek
   through a gap between the wrap border and 日月火… header (schedule + タスク). */
.jm-module--month .jm-month-wrap {
  border-top: 0 !important;
  background: #fff;
}

/* Smartphone month (schedule / facility / タスク): fit all 7 days, title-only one row */
@media (max-width: 991.98px) {
  .jm-module--month .jm-month-wrap,
  .jm-module--month > #sch-month-wrap,
  .jm-module--month > #fac-month-wrap,
  .jm-module--month > #task-month-wrap,
  .task-month > #task-month-wrap {
    overflow-x: hidden !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-y;
  }
  .jm-module--month .jm-month-calendar,
  .task-month .jm-month-calendar {
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }
  .jm-module--month .jm-month-weekdays,
  .jm-module--month .jm-month-week,
  .task-month .jm-month-weekdays,
  .task-month .jm-month-week {
    grid-template-columns: repeat(7, minmax(0, 1fr));
    width: 100%;
  }
  .jm-module--month .jm-month-day,
  .jm-module--month .jm-month-weekday,
  .task-month .jm-month-day,
  .task-month .jm-month-weekday {
    width: auto;
    min-width: 0;
    max-width: none;
  }
  .jm-module--month .jm-month-week,
  .task-month .jm-month-week {
    --jm-span-chip-h: 1.15rem;
    --jm-span-lane-h: calc(var(--jm-span-chip-h) + 2px);
    --jm-month-head-h: 1.4rem;
  }
  .jm-module--month .jm-month-weekday,
  .task-month .jm-month-weekday {
    padding: 0.35rem 0.1rem;
    font-size: 0.75rem;
  }
  .jm-module--month .jm-month-date,
  .task-month .jm-month-date {
    font-size: 0.8rem;
  }
  .jm-module--month .jm-month-holiday-name,
  .task-month .jm-month-holiday-name {
    display: none;
  }
  /* One event/task = one compact row; full detail via click popover */
  .jm-module--month .jm-month-events .jm-ev-time {
    display: none !important;
  }
  .jm-module--month .jm-month-events .jm-event,
  .task-month .jm-month-events .jm-event {
    overflow: hidden;
    padding: 0.1rem 0.2rem;
    margin-bottom: 2px;
    min-height: 0;
    line-height: 1.25;
  }
  .jm-module--month .jm-month-events .jm-ev-title,
  .task-month .jm-month-events .jm-ev-title {
    display: block;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis;
    word-break: normal !important;
    overflow-wrap: normal !important;
    font-size: 0.7rem;
    line-height: 1.25;
  }
  .jm-module--month .jm-month-events .jm-ev-all-day {
    display: flex;
    align-items: center;
    gap: 0.15rem;
    min-width: 0;
  }
  .jm-module--month .jm-month-events .jm-ev-24h {
    width: 0.9rem;
    height: 0.9rem;
    margin-top: 0;
  }
  .jm-module--month .jm-month-events .jm-ev-24-icon,
  .jm-module--month .jm-month-events .jm-ev-24h .jm-ev-24-icon.app-icon {
    width: 0.9rem;
    height: 0.9rem;
  }
  .jm-module--month .jm-month-spans .jm-week-span.jm-event,
  .task-month .jm-month-spans .jm-week-span.jm-event {
    overflow: hidden;
    padding: 0.1rem 0.2rem;
    white-space: nowrap;
  }
  .jm-module--month .jm-month-spans .jm-ev-title,
  .jm-module--month .jm-month-spans .jm-ev-all-day .jm-ev-title,
  .task-month .jm-month-spans .jm-ev-title {
    display: block;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis;
    word-break: normal !important;
    overflow-wrap: normal !important;
    font-size: 0.7rem;
    line-height: 1.25;
    min-width: 0;
  }
  .jm-module--month .jm-month-spans .jm-ev-all-day {
    display: flex;
    align-items: center;
    gap: 0.15rem;
    min-width: 0;
    overflow: hidden;
  }
  .jm-module--month .jm-month-spans .jm-ev-24h {
    width: 0.9rem;
    height: 0.9rem;
    margin-top: 0;
    flex-shrink: 0;
  }
  .jm-module--month .jm-month-spans .jm-ev-24-icon,
  .jm-module--month .jm-month-spans .jm-ev-24h .jm-ev-24-icon.app-icon {
    width: 0.9rem;
    height: 0.9rem;
  }
  /* Shorter empty band under the date / events so phone month cells are not so tall */
  .jm-module--month .jm-month-week,
  .task-month .jm-month-week,
  .jm-module--month .jm-month-day,
  .task-month .jm-month-day {
    min-height: 5.75rem;
  }
  .jm-module--month .jm-month-add-space,
  .task-month .jm-month-add-space {
    min-height: 1.75rem;
  }
}
.jm-module--week .jm-grid th.jm-sun,
.jm-module--week .jm-grid th.jm-sat,
.jm-module--week .jm-grid th.jm-holiday {
  background: #fff !important;
}
.jm-module--week .jm-grid th.jm-today {
  background: var(--hirakumo-focus-fill) !important;
}
.jm-month-calendar {
  min-height: 100%;
  display: flex;
  flex-direction: column;
  overflow: visible;
}
.jm-month-weekdays {
  flex: 0 0 auto;
  position: sticky;
  top: 0;
  /* Above scrolled month chips / multi-day spans (schedule + タスク) */
  z-index: 20;
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  border-top: 0.5px solid #e0e0e0;
  border-bottom: 0.5px solid #e0e0e0;
  background: #fff;
  /* Soft lift below + solid white seal above (kills subpixel bleed while scrolling) */
  box-shadow:
    0 -2px 0 2px #fff,
    0 3px 8px rgba(15, 23, 42, 0.1);
}
.jm-month-weekdays::before {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: -3px;
  height: 3px;
  background: #fff;
  pointer-events: none;
}
.jm-month-weekday {
  padding: 0.4rem 0.35rem;
  text-align: center;
  font-size: 0.875rem;
  font-weight: 400;
  color: #4b5563;
  border-right: 0.5px solid #e0e0e0;
  background: #fff;
  position: relative;
  z-index: 1;
}
.jm-month-weekday:last-child {
  border-right: none;
}
.jm-month-weekday.jm-sun {
  color: var(--hirakumo-danger);
  background: #fff;
}
.jm-month-weekday.jm-sat {
  color: var(--hirakumo-accent2);
  background: #fff;
}
/* Rows grow with events; the month wrap (like week .jm-grid-wrap) scrolls */
.jm-month-body {
  flex: 1 0 auto;
  display: flex;
  flex-direction: column;
  /* Keep all week rows / event chips under the sticky 日月火… header while scrolling */
  position: relative;
  z-index: 0;
}
.jm-month-week {
  position: relative;
  z-index: 0;
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  flex: 1 0 auto;
  min-height: 7.25rem;
  align-items: stretch;
  /* Multi-day / 不定期 bars: same lane metrics as weekly */
  --jm-span-chip-h: calc((var(--type-other) * 1.5) + 8px);
  --jm-span-lane-h: calc(var(--jm-span-chip-h) + 4px);
  --jm-month-head-h: 1.65rem;
}
/* Absolute overlay under date heads; bars span day columns (J-MOTTO month style) */
.jm-month-spans {
  position: absolute;
  top: var(--jm-month-head-h);
  left: 0;
  z-index: 2;
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  column-gap: 0;
  row-gap: 0;
  width: 100%;
  pointer-events: none;
}
.jm-month-spans .jm-week-span {
  margin: 0 1px;
}
.jm-month-day {
  min-width: 0;
  padding: 0;
  font-size: 12px;
  color: #333;
  cursor: pointer;
  border-right: 1px solid #d8dbe2;
  border-bottom: 0.5px solid #e0e0e0;
  overflow: visible;
  background: #fff;
  height: auto;
  min-height: 7.25rem;
  display: flex;
  flex-direction: column;
}
.jm-month-week .jm-month-day:last-child {
  border-right: none;
}
.jm-month-day-inner {
  flex: 1 1 auto;
  min-height: 100%;
  height: auto;
  box-sizing: border-box;
  padding: 0;
  display: flex;
  flex-direction: column;
  overflow: visible;
}
.jm-month-day:hover {
  outline: 2px solid #A8DCE1;
  outline-offset: -2px;
  z-index: 1;
}
.jm-month-day.jm-today {
  background: var(--hirakumo-focus-fill) !important;
}
.jm-month-day.jm-today .jm-month-date {
  color: var(--hirakumo-brand-active);
  font-weight: 400;
}
.jm-month-day.jm-today .jm-month-date.jm-sun,
.jm-month-day.jm-today .jm-month-date.jm-holiday {
  color: var(--hirakumo-danger) !important;
}
.jm-month-day.jm-today .jm-month-date.jm-sat {
  color: var(--hirakumo-accent2) !important;
}
.jm-month-date {
  font-weight: 400;
  font-size: 15px;
  color: inherit;
  padding: 2px 4px;
  line-height: 1.2;
  flex: 0 0 auto;
}
.jm-month-day-head {
  display: flex;
  align-items: baseline;
  justify-content: flex-start;
  gap: 0.35rem;
  flex: 0 0 auto;
  min-width: 0;
  min-height: var(--jm-month-head-h, 1.65rem);
  height: var(--jm-month-head-h, 1.65rem);
  padding: 0;
  overflow: hidden;
}
.jm-month-day-head .jm-month-date {
  padding: 2px 0 2px 4px;
}
.jm-month-day.jm-sun,
.jm-month-date.jm-sun {
  color: #B81C22;
}
.jm-month-day.jm-sat,
.jm-month-date.jm-sat {
  color: var(--hirakumo-accent2);
}
.jm-month-day.jm-holiday,
.jm-month-date.jm-holiday {
  color: #B81C22;
}
.jm-month-date.jm-sun,
.jm-month-date.jm-holiday {
  text-decoration: underline;
  text-underline-offset: 2px;
  text-decoration-thickness: 1.5px;
}
.jm-month-holiday-name {
  color: #B81C22;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.2;
  padding: 2px 4px 2px 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  flex: 1 1 auto;
  min-width: 0;
}
.jm-month-events {
  flex: 0 0 auto;
  min-height: 0;
  overflow: visible;
  padding: 0;
}
.jm-month-events .jm-event {
  overflow: visible;
  height: auto;
  margin: 0 0 4px;
  border-radius: 5px;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  font-size: var(--type-other);
  font-weight: var(--type-weight-regular);
}
.jm-month-events .jm-ev-title {
  white-space: normal;
  overflow: visible;
  text-overflow: unset;
  word-break: break-word;
  font-weight: var(--type-weight-regular);
}
.jm-month-events .jm-ev-time {
  font-weight: var(--type-weight-bold);
}
.jm-month-add-space {
  flex: 1 1 auto;
  /* Free band under filled month events for dblclick register */
  min-height: 3rem;
}
.jm-month-day.jm-other-month {
  background: #fff;
  color: #9ca3af;
}
.jm-month-day.jm-other-month .jm-month-date,
.jm-month-day.jm-other-month .jm-month-holiday-name {
  color: #9ca3af;
}

/* Legacy table month grid (unused after grid refactor; keep harmless) */
.jm-month-grid { min-width: 0; table-layout: fixed; width: 100%; }
.jm-month-grid .jm-month-day {
  height: auto;
  min-height: 0;
  padding: 4px;
  vertical-align: top;
}

/* Livewire modal overlay (Bootstrap .modal vars are on .modal only) */
.bs-modal-overlay {
  --bs-modal-width: 500px;
  --bs-modal-header-padding: 1rem 1.25rem;
  --bs-modal-padding: 1rem 1.25rem;
  position: fixed;
  inset: 0;
  z-index: 1055;
  background: rgba(17, 24, 39, 0.45);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  overflow-y: auto;
}
.bs-modal-overlay .modal-dialog {
  margin: auto;
  width: 100%;
  max-width: var(--bs-modal-width);
  pointer-events: auto;
}
.bs-modal-overlay .modal-dialog.modal-lg { --bs-modal-width: 960px; max-width: 960px; }
.bs-modal-overlay .modal-dialog.modal-xl { --bs-modal-width: 1140px; max-width: 1140px; }
.bs-modal-overlay .modal-dialog.modal-xl .modal-content {
  max-height: min(94vh, 960px);
}
.bs-modal-overlay .modal-content {
  display: flex;
  flex-direction: column;
  background: #fff;
  border: none;
  border-radius: 0.75rem;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.25);
  max-height: min(90vh, 860px);
  overflow: hidden;
  pointer-events: auto;
}
.bs-modal-overlay .modal-header {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: var(--bs-modal-header-padding);
  background: #fff;
  border-bottom: 1px solid #f0f1f3;
}
.bs-modal-overlay .modal-title {
  margin: 0;
  flex: 1 1 auto;
  min-width: 0;
  font-size: 1.1rem;
  font-weight: 700;
  line-height: 1.4;
  font-family: var(--shell-font);
  color: #333;
}
.bs-modal-overlay .modal-header .btn {
  flex-shrink: 0;
}
.bs-modal-overlay .modal-header--drag {
  cursor: grab;
  user-select: none;
  touch-action: none;
}
.bs-modal-overlay .modal-header--drag .modal-title {
  cursor: grab;
}
.bs-modal-overlay .modal-header--drag .btn {
  cursor: pointer;
  user-select: auto;
  touch-action: auto;
}
.bs-modal-overlay .modal-dialog.is-dragging {
  user-select: none;
}
.bs-modal-overlay .modal-dialog.is-dragging .modal-header--drag,
.bs-modal-overlay .modal-dialog.is-dragging .modal-header--drag .modal-title {
  cursor: grabbing;
}
.bs-modal-overlay .modal-body {
  flex: 1 1 auto;
  overflow-x: hidden;
  overflow-y: auto;
  padding: var(--bs-modal-padding);
  font-family: var(--shell-font);
  font-size: 0.95rem;
  color: #333;
}
.bs-modal-overlay .excel-import-error-list {
  max-height: 45vh;
  overflow-y: auto;
  margin: 0;
  padding: 0.9rem 1rem;
  color: #842029;
  background-color: #f8d7da;
  border: 1px solid #f5c2c7;
  border-radius: 0.5rem;
}
.bs-modal-overlay .excel-import-error-list ul {
  margin: 0;
  padding-left: 1.2rem;
}
.bs-modal-overlay .excel-import-error-list li {
  margin-bottom: 0.35rem;
}
.bs-modal-overlay .excel-import-error-list li:last-child {
  margin-bottom: 0;
}
.bs-modal-overlay .modal-body .h5,
.bs-modal-overlay .modal-body h3 {
  font-family: var(--shell-font);
  font-weight: 600 !important;
}
.bs-modal-overlay .modal-footer {
  display: flex;
  flex-shrink: 0;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.5rem;
  padding: 0.85rem 1.25rem;
  background: #fff;
  border-top: 1px solid #f0f1f3;
}
.bs-modal-overlay .modal-footer .btn {
  border-radius: var(--shell-btn-radius) !important;
  font-weight: var(--shell-btn-font-weight) !important;
  font-size: var(--shell-btn-font-size) !important;
  padding: var(--shell-btn-padding-y) var(--shell-btn-padding-x) !important;
  min-height: 2.35rem;
}
.bs-modal-overlay .modal-body > .row {
  --bs-gutter-x: 0.75rem;
  margin-left: 0;
  margin-right: 0;
}
.bs-modal-overlay .modal-body > .row > [class*="col-"] {
  padding-left: calc(var(--bs-gutter-x) * 0.5);
  padding-right: calc(var(--bs-gutter-x) * 0.5);
}
/* Schedule / facility add form: hug content, keep 予定 dropdown inside the card */
.bs-modal-overlay:has(.sch-form-modal) {
  overflow: hidden;
}
.bs-modal-overlay .modal-content.sch-form-modal {
  display: flex;
  flex-direction: column;
  min-height: min(90vh, 580px);
  max-height: min(90vh, 860px);
  overflow: hidden;
  border-radius: 0.75rem;
}
.bs-modal-overlay .sch-form-modal .modal-header,
.bs-modal-overlay .sch-form-modal .modal-footer {
  flex: 0 0 auto;
}
.bs-modal-overlay .sch-form-modal .modal-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding-bottom: 1.25rem;
}
.bs-modal-overlay .sch-form-modal .modal-footer {
  position: relative;
  z-index: 2;
  background: #fff;
}
.bs-modal-overlay .sch-form-modal .modal-footer.sch-form-footer {
  padding-bottom: calc(0.85rem + env(safe-area-inset-bottom, 0px));
}

@media (max-width: 991.98px) {
  html:has(.bs-modal-overlay) .ai-fab-wrap {
    visibility: hidden;
    pointer-events: none;
  }
}
.bs-modal-overlay.sch-detail-overlay {
  z-index: 1060;
}
.bs-modal-overlay .modal-dialog.sch-detail-dialog {
  --bs-modal-width: 44rem;
  max-width: 44rem;
  width: min(44rem, calc(100vw - 2rem));
}
.bs-modal-overlay .modal-content.sch-detail-modal {
  min-height: 0;
  max-height: min(90vh, calc(100dvh - 2rem));
  height: auto;
  overflow: hidden;
  border-radius: 0.75rem;
  display: flex;
  flex-direction: column;
}
.bs-modal-overlay .sch-detail-modal .modal-header {
  flex: 0 0 auto;
}
.bs-modal-overlay .sch-detail-modal .modal-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 1rem 1.25rem 1.15rem;
}
.bs-modal-overlay .sch-detail-modal .sch-detail-row {
  margin-bottom: 0.65rem;
}
.sch-detail {
  font-size: 0.95rem;
}
.sch-detail-row {
  display: grid;
  grid-template-columns: 5.75em minmax(0, 1fr);
  column-gap: 0.5rem;
  align-items: start;
  margin-bottom: 0.85rem;
}
.sch-detail-row--last {
  margin-bottom: 0;
}
.sch-detail-label {
  font-weight: 600;
  color: #6b7280;
  white-space: nowrap;
  line-height: 1.5;
}
.sch-detail-people,
.sch-detail-body {
  max-height: min(36vh, 20rem);
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
}
.sch-detail-people {
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  gap: 0.35rem;
}
.sch-detail-people .badge {
  flex: 0 0 auto;
  white-space: nowrap;
}
.sch-detail-body {
  overflow-wrap: anywhere;
  word-break: break-word;
  white-space: pre-wrap;
}
.sch-detail-body a {
  color: var(--hirakumo-brand, #4CBBB4);
  text-decoration: underline;
  word-break: break-all;
}
.sch-detail-body a:hover {
  color: var(--hirakumo-brand-hover, #3aa39c);
}
.sch-detail-value {
  min-width: 0;
  overflow-x: hidden;
  color: #333;
  line-height: 1.5;
}
.sch-detail-irregular-dates,
.sch-detail-irregular-time {
  display: block;
}
.sch-detail-irregular-time {
  margin-top: 0.15rem;
}
.sch-form-modal .sch-dt-input {
  width: auto;
  max-width: 100%;
  min-width: 0;
  flex: 0 0 auto;
}
.sch-form-modal .jm-dt-row,
.jm-dt-row {
  max-width: 100%;
  flex-wrap: wrap;
  min-height: 2rem;
}
.sch-form-modal .jm-dt-row .sch-dt-input[type="date"],
.jm-dt-row .sch-dt-input[type="date"] {
  width: 9.5rem;
}
.sch-dt-input[type="date"]:disabled,
.sch-dt-input:disabled,
.jm-hm-select:disabled,
.form-control:disabled,
.form-select:disabled,
.form-control:disabled:hover,
.form-select:disabled:hover {
  background-color: #EEEEEE !important;
  border-color: var(--hirakumo-disabled) !important;
  color: var(--hirakumo-muted) !important;
  opacity: 1;
  cursor: not-allowed;
  box-shadow: none;
}
.jm-hm.is-disabled {
  opacity: 1;
}
.jm-hm.is-disabled .jm-hm-select {
  background-color: #EEEEEE !important;
  border-color: var(--hirakumo-disabled) !important;
  color: var(--hirakumo-muted) !important;
  cursor: not-allowed;
  pointer-events: none;
}
.sch-dt-section {
  min-height: 0;
}
.sch-dt-row-sizer {
  flex: 0 0 auto;
  width: 0;
  height: 1.95rem;
  overflow: hidden;
  pointer-events: none;
}
.sch-irr-toggle-row {
  min-height: 2rem;
  align-items: center;
}
.sch-irr-pick-hidden {
  visibility: hidden !important;
  pointer-events: none !important;
}
.sch-all-day {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  flex-shrink: 0;
  white-space: nowrap;
  font-size: 0.875rem;
  font-weight: 400;
  color: #333;
  margin: 0;
  cursor: pointer;
}
.sch-all-day .form-check-input {
  margin: 0;
  width: 1rem;
  height: 1rem;
  cursor: pointer;
}
.jm-hm {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  flex: 0 0 auto;
}
.jm-hm-select {
  width: auto;
  min-width: 0;
  padding-left: 0.45rem;
  padding-right: 1.6rem;
}
.jm-hm-hour {
  width: 5.25rem;
}
.jm-hm-minute {
  width: 5.25rem;
}
.jm-hm-select.is-invalid,
.sch-content-trigger.is-invalid,
.sch-content-title-input.is-invalid,
.sch-form-modal .sch-dt-input.is-invalid {
  border-color: #B81C22 !important;
  background-color: #fff5f5;
  box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.15);
}
.jm-hm-select.is-invalid {
  /* Keep only the chevron — Bootstrap's invalid icon clips 「時」「分」 */
  background-image: var(--bs-form-select-bg-img) !important;
  background-position: right 0.5rem center !important;
  background-size: 16px 12px !important;
  padding-right: 1.6rem !important;
}
.jm-hm-select.is-invalid:focus,
.sch-content-trigger.is-invalid:focus,
.sch-content-title-input.is-invalid:focus,
.sch-form-modal .sch-dt-input.is-invalid:focus {
  border-color: #B81C22 !important;
  box-shadow: 0 0 0 0.2rem rgba(220, 38, 38, 0.22);
}
.sch-content-swatch {
  display: inline-block;
  width: 0.95rem;
  height: 0.95rem;
  border-radius: 0.2rem;
  border: 1px solid rgba(0, 0, 0, 0.22);
  vertical-align: -0.1rem;
  margin-right: 0.4rem;
  flex-shrink: 0;
  box-sizing: border-box;
  background-color: var(--sch-swatch, #fff);
}
.sch-content-option {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  min-width: 0;
}
.sch-detail-title-link {
  margin-left: 0.35rem;
  color: var(--hirakumo-brand);
  text-decoration: underline;
  text-underline-offset: 0.12em;
  font-weight: 600;
  white-space: nowrap;
}
.sch-detail-title-link:hover {
  color: var(--hirakumo-brand-hover);
}
.sch-detail-plan {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem 0.6rem;
}
.sch-detail-plan-content {
  padding: 0.1rem 0.5rem;
  border: 1px solid var(--hirakumo-line, #d1d5db);
  border-radius: 0.3rem;
  background: #fff;
}
.sch-detail-plan-title {
  font-weight: 600;
  color: #333;
}
.sch-content-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  min-width: 0;
}
.sch-content-picker {
  position: relative;
  z-index: 2;
  flex: 0 0 18rem;
  width: 18rem;
  max-width: 18rem;
}
.sch-content-title-input {
  flex: 1 1 auto;
  min-width: 0;
}
.sch-content-trigger {
  display: flex;
  align-items: center;
  width: 100%;
  text-align: left;
  background-color: #fff;
  cursor: pointer;
  overflow: hidden;
}
.sch-content-trigger .sch-content-option {
  min-width: 0;
  width: 100%;
}
.sch-content-trigger .sch-content-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sch-content-trigger:focus {
  outline: none;
  box-shadow: 0 0 0 0.2rem rgba(13, 110, 253, 0.2);
}
.sch-content-trigger .sch-content-swatch {
  margin-right: 0;
}
.sch-content-menu {
  position: absolute;
  z-index: 1080;
  top: calc(100% + 0.2rem);
  left: 0;
  right: 0;
  width: 100%;
  min-width: 100%;
  max-width: none;
  max-height: calc(5 * 2.2rem);
  overflow-y: auto;
  background: #fff;
  border: 1px solid #d1d5db;
  border-radius: 0.35rem;
  box-shadow: 0 0.5rem 1.25rem rgba(15, 23, 42, 0.12);
}
.sch-content-item {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  width: 100%;
  height: 2.2rem;
  padding: 0 0.75rem;
  border: 0;
  border-bottom: 1px dotted #c5cdd8;
  background: transparent;
  color: #333;
  font-size: 0.875rem;
  line-height: 1.3;
  text-align: left;
  cursor: pointer;
}
.sch-content-item span:last-child {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sch-content-item:last-child {
  border-bottom: 0;
}
.sch-content-item:hover {
  background: #f3f7fb;
}
.sch-content-item.is-selected {
  background: var(--hirakumo-focus-fill);
}
.sch-content-item .sch-content-swatch {
  margin-right: 0;
  width: 0.95rem;
  height: 0.95rem;
}

/* スケジュール / 設備予約 form on phones: start / end each on one line, 予定 + title stacked */
@media (max-width: 575.98px) {
  .bs-modal-overlay .sch-form-modal {
    --bs-modal-padding: 0.85rem 0.9rem;
    --bs-modal-header-padding: 0.85rem 0.9rem;
  }
  .sch-form-modal .jm-dt-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: center;
    column-gap: 0.4rem;
    row-gap: 0.5rem;
  }
  .sch-form-modal .jm-dt-row .sch-dt-input[type="date"] {
    width: 100%;
  }
  .sch-form-modal .jm-dt-row > .sch-all-day {
    grid-column: 1 / -1;
  }
  .sch-form-modal .jm-hm-hour,
  .sch-form-modal .jm-hm-minute {
    width: 4.6rem;
  }
  .sch-form-modal .sch-content-row {
    flex-wrap: wrap;
  }
  .sch-form-modal .sch-content-picker {
    flex: 1 1 100%;
    width: 100%;
    max-width: none;
  }
  .sch-form-modal .sch-content-title-input {
    flex: 1 1 100%;
  }
}

/* iOS Safari zooms into any field under 16px on focus and leaves the page zoomed */
@supports (-webkit-touch-callout: none) {
  @media (max-width: 991.98px) {
    .form-control,
    .form-select,
    .form-control-sm,
    .form-select-sm,
    textarea,
    input[type="text"],
    input[type="date"],
    input[type="time"],
    input[type="number"],
    input[type="email"],
    input[type="search"],
    input[type="password"],
    select {
      font-size: 16px !important;
    }
  }
}
/* 予定内容一覧: keep 色 narrow and flush against 名称 */
.list-table .sch-content-col-color,
.dash-card > .table-responsive > .table .sch-content-col-color {
  width: 2.5rem;
  max-width: 2.5rem;
  padding-right: 0.35rem !important;
  text-align: left !important;
  white-space: nowrap;
}
.list-table th.sch-content-col-color + th.list-col-start,
.list-table td.sch-content-col-color + td.list-col-start,
.dash-card > .table-responsive > .table th.sch-content-col-color + th.list-col-start,
.dash-card > .table-responsive > .table td.sch-content-col-color + td.list-col-start {
  padding-left: 0.35rem !important;
}

/* AI assistant chat: one full viewport — only the messages and チャット一覧 scroll */
.main-content:has(.ai-page) {
  overflow: hidden;
}
.main-content:has(.ai-page) > .page {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  padding-bottom: 12px;
}
.ai-page {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.ai-chat-card {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  min-height: 0;
  overflow: hidden;
}
/* Phone: chat fills the content area — no gray gutters / rounded card corners */
@media (max-width: 991.98px) {
  .main-content:has(.ai-page) {
    --main-content-pad-x: 0px;
    padding-left: 0;
    padding-right: 0;
    background: #fff;
  }
  .main-content:has(.ai-page) > .page {
    padding: 0 !important;
    background: #fff;
  }
  .page-content.ai-page {
    padding: 0 !important;
    background: #fff;
  }
  .ai-page .ai-chat-card.dash-card,
  .ai-page .ai-chat-card.card,
  .ai-page .dash-card {
    border-radius: 0 !important;
    border: 0 !important;
    margin: 0 !important;
    box-shadow: none !important;
    background: #fff;
  }
  .ai-page .ai-chat-footer {
    padding-left: 0.9rem;
    padding-right: 0.9rem;
    padding-bottom: calc(0.75rem + env(safe-area-inset-bottom, 0px));
  }
  /* Copyright sits under the chat on phone and leaves gray corners — hide it here */
  .main-content:has(.ai-page) > .site-footer {
    display: none;
  }
}
.ai-page-head {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 0.75rem 1rem;
  border-bottom: 1px solid #eef2f6;
  background: #fff;
}
.ai-page-head-title {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  font-weight: 700;
  font-size: 1rem;
  color: var(--hirakumo-ink, #1f2937);
}
.ai-page-head-icon {
  width: 1.4rem;
  height: 1.4rem;
  flex-shrink: 0;
}
.ai-page-head-actions {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}
.ai-page-body {
  position: relative;
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.ai-chat-layout--page {
  padding-right: 0 !important;
  width: 100%;
}
.ai-page-body > .ai-side-history {
  flex-direction: row;
  justify-content: flex-end;
  align-items: stretch;
}
.ai-side-history-sheet--page {
  width: min(100%, 360px);
  max-width: 360px;
  height: 100%;
  max-height: 100%;
  border-bottom: 0;
  border-left: 1px solid #e5e7eb;
  box-shadow: -10px 0 28px rgba(15, 23, 42, 0.12);
}
.ai-side-history-sheet--page .ai-chat-history-content {
  flex: 1 1 auto;
  max-height: none;
  overflow: auto;
}
/* Chat column + チャット一覧 side panel (toggled by the ☰ button) */
.ai-chat-layout {
  position: relative;
  flex: 1 1 auto;
  display: flex;
  min-height: 0;
}
.ai-chat-main {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
}
.ai-chat-tool-btn {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.2rem;
  height: 2.2rem;
  padding: 0;
  border: 0;
  background: rgba(var(--bs-primary-rgb), 0.12);
  color: var(--bs-primary);
  font-size: 1.15rem;
  line-height: 1;
  cursor: pointer;
  border-radius: 8px;
  transition: background-color 0.15s ease;
}
.ai-chat-tool-btn:hover:not(:disabled),
.ai-chat-history-row:hover:not(:disabled) .ai-chat-tool-btn { background: rgba(var(--bs-primary-rgb), 0.22); }
.ai-chat-tool-btn:focus-visible { outline: 2px solid rgba(var(--bs-primary-rgb), 0.35); outline-offset: 2px; }
/* チャット一覧 sits right of the chat; collapsed it shrinks to an icon strip */
.ai-chat-history {
  flex: 0 0 280px;
  width: 280px;
  display: flex;
  flex-direction: column;
  min-height: 0;
  background: #fff;
  border-left: 1px solid #eef2f6;
  overflow: hidden;
  transition: flex-basis 0.2s ease, width 0.2s ease;
}
/* Icon + teal label rows (新しいチャット / チャット一覧) */
.ai-chat-history-row {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 0.6rem;
  width: 100%;
  padding: 0.3rem 0.6rem;
  border: 0;
  background: #fff;
  font-size: 0.875rem;
  font-weight: 700;
  color: var(--bs-primary);
  text-align: left;
  white-space: nowrap;
}
button.ai-chat-history-row { cursor: pointer; }
button.ai-chat-history-row:disabled { opacity: 0.5; cursor: not-allowed; }
.ai-chat-history-head {
  padding-top: 0.75rem;
}
.ai-chat-history-new {
  flex: 0 0 auto;
  padding: 0.3rem 0.6rem 0.6rem;
  border-bottom: 1px solid #eef2f6;
}
.ai-chat-new-btn {
  width: 100%;
  white-space: nowrap;
  overflow: hidden;
}
.ai-chat-history-search-input {
  flex: 1 1 auto;
  min-width: 0;
  min-height: 2.2rem;
  height: 2.2rem;
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
  font-weight: 400;
}
.ai-chat-history-content {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.ai-chat-history:not(.is-open) {
  flex-basis: 3.4rem;
  width: 3.4rem;
}
.ai-chat-history:not(.is-open) .ai-chat-history-row {
  justify-content: center;
  padding-left: 0;
  padding-right: 0;
}
.ai-chat-history:not(.is-open) .ai-chat-history-new {
  display: flex;
  justify-content: center;
  padding: 0.3rem 0;
  border-bottom: 0;
}
.ai-chat-history:not(.is-open) .ai-chat-new-btn {
  width: 2.2rem;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.ai-chat-history:not(.is-open) .ai-chat-history-label,
.ai-chat-history:not(.is-open) .ai-chat-history-search-input,
.ai-chat-history:not(.is-open) .ai-chat-history-content {
  display: none;
}
.ai-chat-history-empty {
  padding: 1rem;
  font-size: 0.85rem;
  color: #6b7280;
}
.ai-chat-history-list {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
}
.ai-chat-history-item {
  display: flex;
  align-items: center;
  border-bottom: 1px solid #f1f4f7;
}
.ai-chat-history-item:hover { background: #f3faf9; }
.ai-chat-history-item.is-current { background: #e6f7f5; box-shadow: inset 3px 0 0 var(--bs-primary); }
.ai-chat-history-select {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.15rem;
  padding: 0.55rem 0.25rem 0.55rem 1rem;
  border: 0;
  background: transparent;
  text-align: left;
  color: #333;
}
.ai-chat-history-select:disabled { opacity: 0.6; }
.ai-chat-history-title {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 0.875rem;
}
.ai-chat-history-item.is-current .ai-chat-history-title { font-weight: 700; }
.ai-chat-history-date {
  font-size: 0.72rem;
  color: #6b7280;
}
.ai-chat-history-edit {
  flex: 1 1 auto;
  min-width: 0;
  padding: 0.45rem 0.75rem 0.45rem 1rem;
}
.ai-chat-history-tools {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  padding-right: 0.4rem;
}
.ai-chat-history-rename,
.ai-chat-history-delete {
  padding: 0.25rem 0.35rem;
  color: #9ca3af;
  text-decoration: none;
}
.ai-chat-history-rename:hover { color: var(--bs-primary); }
.ai-chat-history-delete:hover { color: #dc3545; }
/* Phones: the icon strip keeps its space; the open list slides over the chat instead of squeezing it */
@media (max-width: 767.98px) {
  .ai-chat-layout {
    padding-right: 3.4rem;
  }
  .ai-chat-history {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 5;
    width: min(85%, 300px);
    box-shadow: -8px 0 24px rgba(15, 23, 42, 0.12);
  }
  .ai-chat-history:not(.is-open) {
    box-shadow: none;
  }
}
.ai-chat-subtitle {
  margin-top: 0.15rem;
  font-size: 0.8rem;
  color: #6b7280;
}
.ai-chat-badge {
  background: #FFF7EB;
  color: #92400e;
  font-size: 0.72rem;
  font-weight: 600;
  padding: 0.35rem 0.65rem;
  border-radius: 999px;
}
.ai-chat-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  padding: 1.15rem 1.25rem;
  background: #fff;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.ai-chat-welcome {
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 14px;
  padding: 1rem 1.1rem;
}
.ai-chat-welcome-title {
  font-size: 0.95rem;
  font-weight: 700;
  color: #333;
  margin-bottom: 0.35rem;
}
.ai-chat-welcome-text {
  font-size: 0.85rem;
  color: #6b7280;
  margin-bottom: 0;
}
.ai-chat-messages {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
}
/* Fresh chat: centered logo + greeting instead of a chat bubble */
.ai-chat-hero {
  margin: auto;
  max-width: 36rem;
  padding: 1.5rem 1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.ai-chat-hero-logo {
  margin-bottom: 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ai-chat-hero-logo .app-icon,
.ai-chat-hero-icon {
  width: 3.5rem;
  height: 3.5rem;
}
.ai-chat-hero-title {
  margin: 0 0 0.5rem;
  font-size: var(--type-heading);
  font-weight: var(--type-weight-bold);
  color: var(--hirakumo-ink);
}
.ai-chat-hero-text {
  margin: 0;
  font-size: var(--type-body);
  font-weight: var(--type-weight-regular);
  color: var(--hirakumo-muted);
}
.ai-msg {
  display: flex;
  align-items: flex-end;
  gap: 0.55rem;
  max-width: min(100%, 38rem);
}
.ai-msg--user {
  align-self: flex-end;
  flex-direction: row-reverse;
}
.ai-msg--bot {
  align-self: flex-start;
}
.ai-msg-avatar {
  width: 1.85rem;
  height: 1.85rem;
  border-radius: 999px;
  background: var(--hirakumo-brand);
  color: #fff;
  font-size: 0.62rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.ai-msg-avatar .app-icon,
.ai-msg-avatar-icon {
  width: 1.05rem;
  height: 1.05rem;
}
.ai-msg-bubble {
  min-width: 0;
  overflow-wrap: anywhere;
  padding: 0.7rem 0.95rem;
  border-radius: 14px;
  font-size: 0.85rem;
  line-height: 1.55;
  background: #fff;
  border: 1px solid #e5e7eb;
  color: #333;
}
/* User messages stay as typed. Assistant messages are formatted HTML. */
.ai-msg--user .ai-msg-text {
  white-space: pre-wrap;
}
.ai-msg--bot .ai-msg-text {
  white-space: normal;
}
.ai-msg--bot .ai-md-heading {
  font-size: 0.95rem;
  font-weight: 700;
  line-height: 1.4;
  margin: 0.85rem 0 0.35rem;
}
.ai-msg--bot .ai-md-heading:first-child {
  margin-top: 0;
}
.ai-msg--bot .ai-msg-text p {
  margin: 0 0 0.55rem;
}
.ai-msg--bot .ai-msg-text p:last-child,
.ai-msg--bot .ai-md-list:last-child {
  margin-bottom: 0;
}
.ai-msg--bot .ai-md-list {
  margin: 0.15rem 0 0.55rem;
  padding-left: 1.25rem;
}
.ai-msg--bot .ai-md-list li {
  margin: 0.15rem 0;
}
.ai-msg--bot .ai-msg-text strong {
  font-weight: 700;
}
.ai-msg--bot .ai-msg-text a {
  color: var(--hirakumo-brand, #4CBBB4);
  text-decoration: underline;
  word-break: break-all;
}
.ai-msg--bot .ai-msg-text code {
  font-size: 0.9em;
  background: #f3f4f6;
  padding: 0.05em 0.3em;
  border-radius: 4px;
}
.ai-msg--bot .ai-md-pre {
  margin: 0.35rem 0 0.55rem;
  padding: 0.45rem 0.6rem;
  background: #f3f4f6;
  border-radius: 8px;
  white-space: pre-wrap;
  overflow-x: auto;
}
.ai-msg--user .ai-msg-bubble {
  background: var(--hirakumo-accent2);
  border-color: var(--hirakumo-accent2);
  color: #fff;
}
.ai-msg--muted .ai-msg-bubble {
  color: #6b7280;
  font-style: italic;
}
.ai-chat-suggestions-label {
  display: block;
  font-size: 0.75rem;
  font-weight: 600;
  color: #9ca3af;
  margin-bottom: 0.45rem;
}
.ai-chat-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}
.ai-chip {
  border: 1px solid #d1d5db;
  background: #fff;
  color: #4b5563;
  border-radius: 999px;
  padding: 0.35rem 0.8rem;
  font-size: 0.78rem;
  line-height: 1.3;
}
.ai-chip:disabled {
  opacity: 0.65;
  cursor: not-allowed;
}
.ai-chat-footer {
  padding: 0.95rem 1.25rem 1.1rem;
  border-top: 1px solid #eef2f6;
  background: #fff;
}
.ai-chat-footer--welcome {
  border-top-color: transparent;
}
.ai-chat-input-wrap {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}
.ai-chat-input-row {
  display: flex;
  align-items: flex-end;
  gap: 0.55rem;
}
/* One line when empty; grows with the message (grow-textarea.js), then scrolls past max-height.
   Selector outranks the site-wide textarea.form-control / textarea.grow-textarea rules. */
textarea.form-control.ai-chat-input {
  flex: 1 1 auto;
  min-width: 0;
  width: auto;
  min-height: 2.5rem;
  max-height: 12rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  line-height: 1.45;
  resize: none;
  overflow-y: auto;
  border-radius: 1.25rem;
}
textarea.form-control.ai-chat-input::placeholder {
  font-weight: 300;
  color: #9ca3af;
  opacity: 1;
}
textarea.form-control.ai-chat-input::-webkit-input-placeholder {
  font-weight: 300;
  color: #9ca3af;
}
textarea.form-control.ai-chat-input::-moz-placeholder {
  font-weight: 300;
  color: #9ca3af;
  opacity: 1;
}
.ai-chat-input-meta {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 0.5rem 0.75rem;
  /* Sit under the textarea’s right edge (not under the send button) */
  padding-right: calc(2.5rem + 0.55rem);
  text-align: right;
}
.ai-chat-send {
  width: 2.5rem;
  height: 2.5rem;
  min-width: 2.5rem;
  min-height: 2.5rem;
  padding: 0 !important;
  border-radius: 50% !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  align-self: flex-end;
  --bs-btn-bg: var(--hirakumo-brand);
  --bs-btn-border-color: var(--hirakumo-brand);
  --bs-btn-hover-bg: var(--hirakumo-brand-hover);
  --bs-btn-hover-border-color: var(--hirakumo-brand-hover);
  --bs-btn-active-bg: var(--hirakumo-brand-active);
  --bs-btn-active-border-color: var(--hirakumo-brand-active);
  --bs-btn-disabled-bg: var(--hirakumo-disabled);
  --bs-btn-disabled-border-color: var(--hirakumo-disabled);
  background-color: var(--hirakumo-brand) !important;
  border-color: var(--hirakumo-brand) !important;
}
.ai-chat-send:hover:not(:disabled),
.ai-chat-send:focus:not(:disabled) {
  background-color: var(--hirakumo-brand-hover);
  border-color: var(--hirakumo-brand-hover);
}
.ai-chat-send:active:not(:disabled) {
  background-color: var(--hirakumo-brand-active);
  border-color: var(--hirakumo-brand-active);
}
.ai-chat-footnote {
  margin-top: 0.55rem;
  font-size: 0.72rem;
  color: #9ca3af;
  text-align: center;
}
.ai-msg--typing .ai-msg-bubble {
  display: inline-flex;
  align-items: center;
  gap: 0.28rem;
  min-height: 2.4rem;
  padding-top: 0.85rem;
  padding-bottom: 0.85rem;
}
.ai-msg-bubble--working {
  flex-direction: row;
  align-items: center;
  gap: 0.75rem !important;
  min-width: min(18rem, 78vw);
}
.ai-typing-dots {
  display: inline-flex;
  align-items: center;
  gap: 0.28rem;
  flex-shrink: 0;
}
.ai-typing-status {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
  line-height: 1.35;
}
.ai-typing-status strong {
  font-size: 0.9rem;
  color: #0f766e;
  font-weight: 700;
}
.ai-typing-dot {
  width: 0.42rem;
  height: 0.42rem;
  border-radius: 999px;
  background: var(--hirakumo-brand);
  animation: ai-typing-bounce 1.1s infinite ease-in-out;
}
.ai-typing-dot:nth-child(2) { animation-delay: 0.15s; }
.ai-typing-dot:nth-child(3) { animation-delay: 0.3s; }
@keyframes ai-typing-bounce {
  0%, 80%, 100% { transform: translateY(0); opacity: 0.45; }
  40% { transform: translateY(-0.28rem); opacity: 1; }
}
.ai-confirm-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  margin: 0.15rem 0 0.55rem 2.55rem;
}
.ai-confirm-btn {
  min-width: 5.5rem;
  font-weight: 700;
  border-radius: 999px;
  padding: 0.45rem 1.1rem;
}
.ai-confirm-btn--yes {
  --bs-btn-bg: var(--hirakumo-brand);
  --bs-btn-border-color: var(--hirakumo-brand);
  --bs-btn-hover-bg: var(--hirakumo-brand-hover);
  --bs-btn-hover-border-color: var(--hirakumo-brand-hover);
  --bs-btn-active-bg: var(--hirakumo-brand-active);
  --bs-btn-active-border-color: var(--hirakumo-brand-active);
  background: var(--hirakumo-brand);
  border-color: var(--hirakumo-brand);
}
.ai-confirm-btn--yes:hover:not(:disabled) {
  background: var(--hirakumo-brand-hover);
  border-color: var(--hirakumo-brand-hover);
}
.ai-confirm-btn--yes:active:not(:disabled) {
  background: var(--hirakumo-brand-active);
  border-color: var(--hirakumo-brand-active);
}
.ai-confirm-btn--no {
  background: #fff;
}
.ai-confirm-btn:disabled {
  opacity: 0.65;
}
.ai-chip:not(:disabled) {
  cursor: pointer;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
.ai-chip:not(:disabled):hover {
  background: #E6F7F5;
  border-color: var(--hirakumo-brand);
  color: var(--hirakumo-brand-active);
}

/* Login */
body.login-page {
  margin: 0;
  background: var(--hirakumo-brand) !important;
}
#login-screen {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
  background: var(--hirakumo-brand) !important;
}
.login-stack {
  width: 100%;
  max-width: 420px;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 1.1rem;
}
.login-card {
  width: 100%;
  max-width: 420px;
  border-radius: 1rem;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.18) !important;
}
.login-error-message {
  white-space: pre-line;
}.login-brand {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  margin-bottom: 1.5rem;
  text-align: center;
  width: 100%;
}
.login-logo-img {
  width: auto;
  max-width: 15.5rem;
  height: auto;
  max-height: 7.25rem;
  object-fit: contain;
  object-position: center;
  border-radius: 0;
  background: transparent;
  flex-shrink: 0;
  margin-inline: auto;
}
.login-brand .logo-text.brand-display,
.login-brand .logo-text.brand-display--login {
  font-size: 1.75rem;
  font-weight: 600;
  color: var(--hirakumo-brand) !important;
  line-height: 1.2;
  text-shadow: none;
}
.login-brand-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  min-width: 0;
}
.login-brand-sub {
  margin-top: 0.15rem;
  font-size: 0.9rem;
  font-weight: 600;
  color: #4b5563;
  line-height: 1.2;
  text-align: center;
}
.login-btn {
  margin-top: 0.35rem;
  min-height: 2.75rem;
  font-weight: 700;
  color: #fff !important;
  background-color: var(--hirakumo-brand) !important;
  border-color: var(--hirakumo-brand) !important;
}
.login-btn:hover,
.login-btn:focus {
  color: #fff !important;
  background-color: var(--hirakumo-brand-hover) !important;
  border-color: var(--hirakumo-brand-hover) !important;
}
.login-btn:active {
  color: #fff !important;
  background-color: var(--hirakumo-brand-active) !important;
  border-color: var(--hirakumo-brand-active) !important;
}

/* Full-screen processing overlay (wire:loading) — blurred backdrop + modern card */
.app-loading-overlay {
  position: fixed;
  inset: 0;
  z-index: 2100;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  background: rgba(15, 23, 42, 0.32);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  animation: app-loading-fade 0.18s ease-out;
}
/* Alpine x-show cannot rely on removing display:none alone (base rule is display:none). */
.app-loading-overlay.app-loading-overlay--active {
  display: flex !important;
}
@keyframes app-loading-fade {
  from { opacity: 0; }
  to { opacity: 1; }
}
.app-loading-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.1rem;
  min-width: 240px;
  max-width: min(100%, 340px);
  padding: 1.75rem 2rem;
  background: #fff;
  border: 1px solid rgba(148, 163, 184, 0.18);
  border-radius: 18px;
  box-shadow: 0 24px 60px rgba(15, 23, 42, 0.22);
  text-align: center;
}
/* Custom dual-ring spinner (replaces Bootstrap spinner-border) */
.app-loading-ring {
  width: 46px;
  height: 46px;
  border-radius: 50%;
  border: 4px solid #e2e8f0;
  border-top-color: #3AA99C;
  animation: app-loading-spin 0.7s linear infinite;
}
@keyframes app-loading-spin {
  to { transform: rotate(360deg); }
}
.app-loading-text {
  font-weight: 600;
  color: #333;
  font-size: 0.95rem;
  line-height: 1.5;
}
/* Indeterminate progress bar under the text */
.app-loading-bar {
  position: relative;
  width: 100%;
  height: 4px;
  border-radius: 999px;
  background: #eef2f7;
  overflow: hidden;
}
.app-loading-bar::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 40%;
  border-radius: 999px;
  background: linear-gradient(90deg, #4CBBB4, #3AA99C);
  animation: app-loading-slide 1.1s ease-in-out infinite;
}
@keyframes app-loading-slide {
  0% { left: -40%; }
  100% { left: 100%; }
}

/* Shared confirmation card (replaces native alert / wire:confirm) */
.app-confirm-overlay {
  position: fixed;
  inset: 0;
  z-index: 2400;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  background: rgba(17, 24, 39, 0.5);
}
.app-confirm-card {
  width: min(100%, 420px);
  background: #fff;
  border-radius: 14px;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.22);
  padding: 1.5rem 1.35rem 1.25rem;
  text-align: center;
}
.app-confirm-icon {
  width: 48px;
  height: 48px;
  margin: 0 auto 0.85rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.35rem;
  font-weight: 700;
  line-height: 1;
}
.app-confirm-icon.is-danger {
  background: transparent;
  color: #B81C22;
}
.app-confirm-icon.is-primary {
  background: #f0fdf4;
  color: #2086A0;
}
.app-confirm-icon .app-confirm-warning-icon.app-icon,
.app-confirm-icon .app-icon.app-confirm-warning-icon,
.app-confirm-icon img.app-confirm-warning-icon {
  width: 48px;
  height: 48px;
  display: block;
}
.app-confirm-title {
  margin: 0 0 0.5rem;
  font-size: 1.1rem;
  font-weight: 700;
  color: #333;
}
.app-confirm-title:empty,
.app-confirm-title[style*="display: none"] {
  margin: 0;
}
.app-confirm-message {
  margin: 0 0 1.25rem;
  font-size: 0.95rem;
  line-height: 1.7;
  color: #4b5563;
  white-space: pre-line;
}
.app-confirm-actions {
  display: flex;
  gap: 0.65rem;
  justify-content: center;
  flex-wrap: wrap;
}
.app-confirm-actions .btn {
  min-width: 7rem;
  min-height: 2.35rem;
  font-weight: var(--shell-btn-font-weight) !important;
  font-size: var(--shell-btn-font-size) !important;
  border-radius: var(--shell-btn-radius) !important;
  padding: var(--shell-btn-padding-y) var(--shell-btn-padding-x) !important;
}
/* Confirm card + 査定準備と同じ横並びラベル／日付入力（複数期限） */
.app-confirm-card--eval-deadline {
  width: min(100%, 30rem);
  text-align: center;
}
.app-confirm-eval-fields {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
  width: 100%;
  max-width: 24rem;
  margin: 0 auto 1.25rem;
  text-align: left;
}
.app-confirm-eval-row {
  width: 100%;
  margin: 0;
}
.app-confirm-eval-row .eval-assign-role-label {
  flex: 0 0 9.5rem;
  width: 9.5rem;
}
html.app-confirm-open {
  overflow: hidden;
}
[x-cloak] { display: none !important; }

/* Meetings — modern soft tables (participants + agenda) */
.meeting-agenda-block {
  display: block;
  width: 100%;
  clear: both;
}
.meeting-agenda-block-label {
  /* Match other meeting form labels; keep long title on one line */
  white-space: nowrap;
}
.meeting-agenda-block-label--muted {
  color: #6c757d !important;
}
.meeting-agenda-main {
  min-width: 0;
  width: 100%;
}
.meeting-agenda-toolbar .meeting-ai-draft-btn:disabled {
  opacity: 0.55;
}
.ai-usage-table .ai-usage-token {
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1;
  letter-spacing: 0.01em;
  white-space: nowrap;
}
.meeting-ai-robot-btn__app-icon {
  width: 1.25rem;
  height: 1.25rem;
  display: block;
}
.meeting-rec-modal {
  position: fixed;
  inset: 0;
  /* Above bubble (1090), AI panel (1085), orgchart backdrop (1090) so buttons stay clickable
     after wire:navigate + reopen from the minimized icon. */
  z-index: 2300;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  pointer-events: auto;
}
.meeting-rec-modal--host {
  z-index: 2300;
}
/* 録音中ログアウト確認は録音モーダルより手前 */
.meeting-rec-leave-overlay {
  z-index: 2400;
}
.meeting-rec-modal__panel,
.meeting-rec-modal__panel button,
.meeting-rec-modal__action-btn {
  pointer-events: auto;
  position: relative;
  z-index: 2;
}
.meeting-rec-modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.55);
}
.meeting-rec-modal__panel {
  position: relative;
  z-index: 1;
  width: min(36rem, 100%);
  background: #fff;
  border-radius: 1rem;
  box-shadow: 0 22px 60px rgba(15, 23, 42, 0.24);
  overflow: hidden;
  transition: width 0.2s ease;
}
.meeting-rec-modal__panel.is-error {
  width: min(42rem, 100%);
}
.meeting-rec-modal__panel.is-error .meeting-rec-modal__error-wrap {
  max-width: none;
  padding: 1rem 1.15rem;
}
.meeting-rec-modal__panel.is-error .meeting-rec-modal__error {
  font-size: 1.05rem;
}
.meeting-rec-modal__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 1.1rem 1.25rem;
  border-bottom: 1px solid #e5e7eb;
  background: linear-gradient(180deg, #f5faf9 0%, #eef8f6 100%);
}
.meeting-rec-modal__head-actions {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  flex-shrink: 0;
}
.meeting-rec-modal__title {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0;
  font-size: 1.15rem;
  font-weight: 700;
  color: #333;
}
.meeting-rec-modal__body {
  padding: 1.5rem 1.35rem 1.6rem;
  background:
    radial-gradient(circle at top center, rgba(76, 187, 180, 0.12), transparent 58%),
    #fff;
}
.meeting-rec-modal__stage {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.25rem;
}
.meeting-rec-modal__hero-icon {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 5.5rem;
  height: 5.5rem;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: linear-gradient(160deg, #4CBBB4 0%, #0086A0 100%);
  color: #fff;
  font-size: 2.35rem;
  box-shadow: 0 10px 28px rgba(0, 134, 160, 0.28);
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
}
.meeting-rec-modal__hero-icon:hover:not(:disabled),
.meeting-rec-modal__hero-icon:focus-visible:not(:disabled) {
  filter: brightness(1.06);
  outline: none;
}
.meeting-rec-modal__hero-icon:disabled {
  cursor: not-allowed;
  opacity: 0.7;
}
.meeting-rec-modal__hero-icon.is-recording {
  background: linear-gradient(160deg, #d94848 0%, #b81c22 100%);
  box-shadow: 0 10px 28px rgba(184, 28, 34, 0.28);
  animation: meeting-rec-pulse 1.4s ease-in-out infinite;
}
.meeting-rec-modal__hero-icon.is-busy {
  cursor: wait;
  opacity: 1;
  transform: none;
  /* Soft fill glow while AI is thinking */
  animation: meeting-rec-busy-glow 1.25s ease-in-out infinite;
}
.meeting-rec-modal__hero-ai-wrap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 0;
}
.meeting-rec-modal__hero-ai {
  width: 2.35rem !important;
  height: 2.35rem !important;
  display: block;
}
/* Stage 3: success (green) — shown ~3s then auto-close; no bottom action */
.meeting-rec-modal__hero-icon.is-done {
  cursor: default;
  opacity: 1;
  animation: none;
  transform: none;
  background: linear-gradient(160deg, #34c759 0%, #248a3d 100%);
  box-shadow: 0 10px 28px rgba(36, 138, 61, 0.28);
}
.meeting-rec-modal__hero-icon.is-done .bi-check-lg {
  font-size: 2.6rem;
  font-weight: 700;
}
/* Thinking: 3 bouncing dots + rotating phrases */
.meeting-rec-modal__thinking {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.85rem;
  width: 100%;
  min-height: 4.1rem;
}
.meeting-rec-dots {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
}
.meeting-rec-dots span {
  width: 0.62rem;
  height: 0.62rem;
  border-radius: 50%;
  background: var(--hirakumo-brand, #4CBBB4);
  animation: meeting-rec-dot-bounce 0.6s infinite alternate;
}
.meeting-rec-dots span:nth-child(2) {
  animation-delay: 0.2s;
  background: var(--hirakumo-brand-active, #0086A0);
}
.meeting-rec-dots span:nth-child(3) {
  animation-delay: 0.4s;
}
.meeting-rec-modal__thinking-text {
  position: relative;
  width: 100%;
  min-height: 1.6rem;
  text-align: center;
}
.meeting-rec-modal__thinking-text span {
  position: absolute;
  inset: 0;
  margin: 0;
  font-size: 1.05rem;
  font-weight: 600;
  color: #334155;
  opacity: 0;
  animation: meeting-rec-phrase 4s infinite;
}
.meeting-rec-modal__thinking-text span:nth-child(1) { animation-delay: 0s; }
.meeting-rec-modal__thinking-text span:nth-child(2) { animation-delay: 2s; }
.meeting-rec-modal__status.is-done {
  color: #248a3d;
}
@keyframes meeting-rec-pulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.04); }
}
@keyframes meeting-rec-busy-glow {
  0%, 100% {
    background: linear-gradient(160deg, #4CBBB4 0%, #0086A0 100%);
    box-shadow: 0 10px 28px rgba(0, 134, 160, 0.28);
  }
  50% {
    background: linear-gradient(160deg, #6AD4CD 0%, #0AA0BC 100%);
    box-shadow: 0 14px 36px rgba(76, 187, 180, 0.55);
  }
}
@keyframes meeting-rec-dot-bounce {
  to {
    transform: translateY(-10px);
    opacity: 0.5;
  }
}
/* 2 steps × 2s in a 4s loop */
@keyframes meeting-rec-phrase {
  0%, 4% {
    opacity: 0;
    transform: translateY(6px);
  }
  12%, 40% {
    opacity: 1;
    transform: translateY(0);
  }
  48%, 100% {
    opacity: 0;
    transform: translateY(-6px);
  }
}
.meeting-rec-modal__status {
  margin: 0;
  min-height: 1.6rem;
  text-align: center;
  font-size: 1.05rem;
  font-weight: 600;
  color: #334155;
}
.meeting-rec-modal__status--title {
  margin-top: 0.15rem;
  min-height: 0;
  max-width: 100%;
  padding: 0 0.75rem;
  font-size: 0.92rem;
  font-weight: 600;
  color: #64748b;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.meeting-rec-modal__controls {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 1rem;
  width: 100%;
}
.meeting-rec-modal__action-btn {
  display: inline-flex;
  width: 100%;
  align-items: center;
  justify-content: center;
  gap: 0.65rem;
  min-height: 4.75rem !important;
  padding: 1.35rem 1.5rem !important;
  border-radius: 0.85rem !important;
  font-size: 1.45rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.04em;
  line-height: 1.2 !important;
  border: 0 !important;
}
.meeting-rec-modal__action-btn i {
  font-size: 1.55rem;
}
/* Same brand rule as 保存 (btn-primary): start #4CBBB4, stop #0086A0 */
.meeting-rec-modal__action-btn--start {
  color: #fff !important;
  background: var(--hirakumo-brand, #4CBBB4) !important;
  border-color: var(--hirakumo-brand, #4CBBB4) !important;
  box-shadow: 0 12px 28px rgba(76, 187, 180, 0.28);
}
.meeting-rec-modal__action-btn--start:hover,
.meeting-rec-modal__action-btn--start:focus {
  color: #fff !important;
  background: var(--hirakumo-brand-hover, #3AA99C) !important;
  border-color: var(--hirakumo-brand-hover, #3AA99C) !important;
}
.meeting-rec-modal__action-btn--stop {
  color: #fff !important;
  background: var(--hirakumo-brand-active, #0086A0) !important;
  border-color: var(--hirakumo-brand-active, #0086A0) !important;
  box-shadow: 0 12px 28px rgba(0, 134, 160, 0.28);
}
.meeting-rec-modal__action-btn--stop:hover:not(:disabled),
.meeting-rec-modal__action-btn--stop:focus:not(:disabled) {
  color: #fff !important;
  background: #00748c !important;
  border-color: #00748c !important;
}
/* Stop button is hidden during thinking / complete (not greyed-out) */
.meeting-rec-modal__error-wrap {
  margin-top: 1rem;
  padding: 0.85rem 1rem;
  border-radius: 0.75rem;
  background: #fef2f2;
  border: 1px solid #fecaca;
  text-align: center;
  box-sizing: border-box;
}
.meeting-rec-modal__error {
  margin: 0;
  font-size: 0.98rem;
  font-weight: 700;
  color: var(--hirakumo-danger, #B81C22);
  line-height: 1.55;
  white-space: pre-line;
}
.meeting-rec-modal__error-hint {
  margin: 0.45rem 0 0;
  font-size: 0.88rem;
  color: #7f1d1d;
}
/* While the large panel is open, never let the FAB steal clicks (z-index was higher). */
.meeting-rec-host.is-modal-open .meeting-rec-bubble {
  pointer-events: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
}
.meeting-rec-bubble {
  position: fixed;
  z-index: 1090; /* above AI FAB (1035) so recording stays visible; default pos clears FAB menu */
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.28rem;
  width: 3.5rem;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  user-select: none;
  touch-action: none;
  cursor: grab;
}
.meeting-rec-bubble[x-cloak] {
  display: none !important;
}
.meeting-rec-bubble.is-dragging {
  cursor: grabbing;
}
.meeting-rec-bubble__time {
  margin: 0;
  padding: 0.15rem 0.55rem;
  border: 0;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.12);
  font-size: 0.78rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  color: #333;
  line-height: 1.3;
  pointer-events: none;
}
/* Always-on label next to the icon showing 録音中… + current 議題. */
.meeting-rec-bubble__popup {
  position: absolute;
  right: calc(100% + 0.6rem);
  top: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.12rem;
  width: max-content;
  max-width: min(17rem, calc(100vw - 6rem));
  padding: 0.5rem 0.7rem;
  border-radius: 0.85rem;
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 10px 26px rgba(15, 23, 42, 0.22);
  text-align: left;
  cursor: pointer;
  pointer-events: auto;
  z-index: 1;
}
.meeting-rec-bubble__popup[x-cloak] {
  display: none !important;
}
.meeting-rec-bubble.is-dragging .meeting-rec-bubble__popup {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
.meeting-rec-bubble__popup::after {
  content: "";
  position: absolute;
  top: 1rem;
  right: -5px;
  width: 10px;
  height: 10px;
  background: rgba(255, 255, 255, 0.98);
  transform: rotate(45deg);
  box-shadow: 2px -2px 4px rgba(15, 23, 42, 0.06);
}
.meeting-rec-bubble__popup-status {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: var(--hirakumo-danger, #B81C22);
}
.meeting-rec-bubble__popup-timer {
  font-size: 0.82rem;
  font-weight: 800;
  font-variant-numeric: tabular-nums;
  color: var(--hirakumo-danger, #B81C22);
}
.meeting-rec-bubble.is-busy .meeting-rec-bubble__popup-timer,
.meeting-rec-bubble.is-done .meeting-rec-bubble__popup-timer {
  color: #0086A0;
}
.meeting-rec-bubble__popup-status::before {
  content: "";
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
  background: var(--hirakumo-danger, #B81C22);
  animation: meeting-rec-pulse 1.4s ease-in-out infinite;
}
.meeting-rec-bubble.is-busy .meeting-rec-bubble__popup-status,
.meeting-rec-bubble.is-done .meeting-rec-bubble__popup-status {
  color: #0086A0;
}
.meeting-rec-bubble.is-busy .meeting-rec-bubble__popup-status::before,
.meeting-rec-bubble.is-done .meeting-rec-bubble__popup-status::before {
  background: #0086A0;
}
.meeting-rec-bubble__popup-title {
  font-size: 0.82rem;
  font-weight: 700;
  line-height: 1.35;
  color: #333;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  word-break: break-word;
}
.meeting-rec-bubble__icon {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 3.25rem;
  height: 3.25rem;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: linear-gradient(160deg, #d94848 0%, #b81c22 100%);
  color: #fff;
  font-size: 1.35rem;
  box-shadow: 0 8px 20px rgba(184, 28, 34, 0.32);
  flex-shrink: 0;
  pointer-events: none;
}
.meeting-rec-bubble__icon.is-recording {
  animation: meeting-rec-pulse 1.4s ease-in-out infinite;
}
.meeting-rec-bubble__icon.is-busy {
  background: linear-gradient(160deg, #4CBBB4 0%, #0086A0 100%);
  box-shadow: 0 8px 20px rgba(0, 134, 160, 0.3);
  animation: none;
}
.meeting-rec-bubble__icon.is-done {
  background: linear-gradient(160deg, #4CBBB4 0%, #0086A0 100%);
  box-shadow: 0 8px 20px rgba(0, 134, 160, 0.3);
  animation: none;
}
.meeting-rec-bubble__spinner {
  width: 1.25rem;
  height: 1.25rem;
  border-radius: 50%;
  border: 2px solid rgba(255, 255, 255, 0.35);
  border-top-color: #fff;
  animation: meeting-rec-bubble-spin 0.7s linear infinite;
}
@keyframes meeting-rec-bubble-spin {
  to { transform: rotate(360deg); }
}
.meeting-recorder__bars--lg {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 0.35rem;
  height: 3.25rem;
  min-width: 100%;
  padding: 0.35rem 0.5rem;
  border-radius: 0.75rem;
  background: transparent;
  border: 0;
  opacity: 0.55;
}
.meeting-recorder__bars--lg.is-active {
  opacity: 1;
}
.meeting-recorder__bars--lg .meeting-recorder__bar {
  width: 0.45rem;
  border-radius: 999px;
  background: var(--hirakumo-brand, #4CBBB4);
}
.meeting-agenda-block-body {
  display: block;
  width: 100%;
}
.meeting-agenda-locked {
  opacity: 0.72;
  pointer-events: none;
}
.meeting-table-wrap {
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  overflow: hidden;
  background: #fff;
  width: 100%;
}
.meeting-meta-table,
.meeting-agenda-table {
  margin-bottom: 0;
  --bs-table-bg: transparent;
  table-layout: fixed;
  width: 100%;
}
.meeting-agenda-table th:nth-child(2),
.meeting-agenda-table td:nth-child(2) {
  width: 34%;
}
.meeting-agenda-table th:nth-child(3),
.meeting-agenda-table td:nth-child(3) {
  width: auto;
}
.meeting-meta-table > :not(caption) > * > *,
.meeting-agenda-table > :not(caption) > * > * {
  border-bottom-color: #f0f1f3;
  padding: 0.85rem 1rem;
  vertical-align: top;
  border-left: 0;
  border-right: 0;
}
.meeting-meta-table > :not(caption) > * > * {
  padding: 0.4rem 0.75rem;
  vertical-align: middle;
}
.meeting-meta-table thead th,
.meeting-agenda-table thead th,
.meeting-summary-heading {
  background: #e4e8e5 !important;
  color: #333;
  font-family: inherit;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.01em;
  border-bottom: none !important;
  white-space: nowrap;
}
.meeting-meta-table tbody tr:last-child > *,
.meeting-agenda-table tbody tr:last-child > * {
  border-bottom: none !important;
}
.meeting-agenda-num {
  width: 3.25rem;
  min-width: 3.25rem;
  text-align: center;
  color: #9ca3af;
  font-weight: 600;
  white-space: nowrap;
  word-break: keep-all;
  overflow-wrap: normal;
}
.meeting-agenda-owner {
  width: 9.5rem;
  min-width: 8.5rem;
  max-width: 11rem;
}
.meeting-agenda-action {
  width: 2.75rem;
}

/* Meeting detail — browser recorder → AI agenda */
.meeting-recorder {
  border: 1px solid #e5e7eb;
  border-radius: 0.65rem;
  padding: 0.85rem 1rem;
  background: #f8faf9;
}
.meeting-recorder--inline {
  padding: 0.55rem 0.75rem;
  margin-bottom: 0.65rem;
}
.meeting-recorder__label {
  font-size: 0.9rem;
  font-weight: 600;
  color: #333;
  margin-bottom: 0.55rem;
}
.meeting-recorder__row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.65rem 0.85rem;
}
.meeting-recorder__bars {
  display: inline-flex;
  align-items: flex-end;
  gap: 3px;
  height: 2rem;
  min-width: 6.5rem;
  padding: 0 0.15rem;
}
.meeting-recorder__bar {
  display: block;
  width: 3px;
  min-height: 12%;
  border-radius: 2px;
  background: #4CBBB4;
  transition: height 0.08s linear;
}
.meeting-recorder__hint,
.meeting-recorder__error,
.meeting-recorder__status {
  flex: 1 1 100%;
}
.meeting-agenda-cell {
  white-space: pre-wrap;
  word-break: break-word;
  overflow-wrap: anywhere;
  line-height: 1.55;
  color: #333;
}
.meeting-summary-panel {
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  overflow: hidden;
  background: #fff;
  width: 100%;
}
.meeting-summary-heading {
  display: block;
  margin: 0;
  padding: 0.85rem 1rem;
}
.meeting-summary-input {
  min-height: calc(1.45rem + 0.5rem);
  line-height: 1.45rem;
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
}
.meeting-summary-input--ai {
  min-height: 9rem;
  max-height: none;
  height: auto;
  line-height: 1.55;
  white-space: pre-wrap;
  padding: 0.55rem 0.75rem !important;
  margin: 0.65rem 0.75rem 0.85rem;
  width: calc(100% - 1.5rem);
  max-width: calc(100% - 1.5rem);
  font-size: 0.925rem;
  color: #333;
  background: #fcfdfc;
  border: 1px solid #e5e7eb;
  border-radius: 0.375rem;
  box-shadow: none;
  overflow-x: hidden;
  overflow-y: hidden;
  resize: none;
  field-sizing: content;
  pointer-events: auto;
  cursor: text;
}
.meeting-summary-input--ai:focus {
  background: #fff;
  border-color: #86c97a;
  box-shadow: 0 0 0 0.2rem rgba(76, 187, 180, 0.15);
  outline: none;
}
.meeting-summary-input--ai[readonly] {
  cursor: default;
  background: #f9fafb;
}
.meeting-summary-display {
  white-space: pre-wrap;
  word-break: break-word;
  overflow-wrap: anywhere;
  line-height: 1.55;
  font-size: 0.925rem;
  color: #333;
  padding: 0.85rem 1rem;
  background: #fff;
  border: 0;
  border-radius: 0;
  min-height: 6rem;
}
.meeting-summary-display--empty,
.meeting-agenda-empty-state {
  white-space: normal;
  min-height: 4.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  color: #6c757d;
  background: #fff;
  font-size: 0.925rem;
  padding: 1.5rem 1rem;
  width: 100%;
  box-sizing: border-box;
}
.meeting-generating-state {
  flex-direction: column;
  gap: 0.75rem;
  color: var(--hirakumo-brand-active, #0086A0);
  font-weight: 600;
}
.meeting-generating-state .meeting-rec-dots span {
  width: 0.48rem;
  height: 0.48rem;
}
.meeting-summary-generating-wrap {
  position: relative;
}
.meeting-summary-generating-overlay {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  min-height: 6rem;
  padding: 1.25rem 1rem;
  border: 1px solid #e5e7eb;
  background: #fafafa;
  color: var(--hirakumo-brand-active, #0086A0);
  font-weight: 600;
  font-size: 0.925rem;
}
.meeting-minutes-toast {
  position: fixed;
  right: 1.25rem;
  bottom: 1.25rem;
  z-index: 2400;
  display: flex;
  align-items: stretch;
  max-width: min(22rem, calc(100vw - 1.5rem));
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 0.75rem;
  box-shadow: 0 12px 32px rgba(15, 23, 42, 0.16);
  overflow: hidden;
}
.meeting-minutes-toast[x-cloak] {
  display: none !important;
}
.meeting-minutes-toast__card {
  flex: 1 1 auto;
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  margin: 0;
  padding: 0.9rem 0.75rem 0.9rem 1rem;
  border: 0;
  background: transparent;
  text-align: left;
  cursor: pointer;
  color: inherit;
}
.meeting-minutes-toast__card:hover {
  background: #f8fafc;
}
.meeting-minutes-toast__icon {
  flex: 0 0 auto;
  font-size: 1.15rem;
  line-height: 1;
  color: var(--hirakumo-brand, #4CBBB4);
  margin-top: 0.1rem;
}
.meeting-minutes-toast__card:has(.bi-exclamation-circle-fill) .meeting-minutes-toast__icon,
.meeting-minutes-toast--error .meeting-minutes-toast__icon {
  color: var(--hirakumo-danger, #dc3545);
}
.meeting-minutes-toast__body {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}
.meeting-minutes-toast__title {
  font-size: 0.82rem;
  font-weight: 700;
  color: #333;
  line-height: 1.3;
  word-break: break-word;
}
.meeting-minutes-toast__message {
  font-size: 0.8rem;
  color: #4b5563;
  line-height: 1.4;
  word-break: break-word;
}
.meeting-minutes-toast__hint {
  font-size: 0.72rem;
  color: var(--hirakumo-brand-active, #0086A0);
  margin-top: 0.2rem;
}
.meeting-minutes-toast__close {
  flex: 0 0 auto;
  border: 0;
  background: transparent;
  color: #6b7280;
  padding: 0.65rem 0.7rem;
  cursor: pointer;
}
.meeting-minutes-toast__close:hover {
  color: #333;
  background: #f3f4f6;
}
.meeting-minutes-toast-enter {
  transition: opacity 0.25s ease, transform 0.25s ease;
}
.meeting-minutes-toast-enter-start {
  opacity: 0;
  transform: translateY(12px);
}
.meeting-minutes-toast-enter-end {
  opacity: 1;
  transform: translateY(0);
}
.meeting-minutes-toast-leave {
  transition: opacity 0.2s ease, transform 0.2s ease;
}
.meeting-minutes-toast-leave-start {
  opacity: 1;
  transform: translateY(0);
}
.meeting-minutes-toast-leave-end {
  opacity: 0;
  transform: translateY(8px);
}
@media (max-width: 576px) {
  .meeting-minutes-toast {
    right: 0.75rem;
    left: 0.75rem;
    bottom: 0.75rem;
    max-width: none;
  }
}
.meeting-attach-download {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  color: var(--hirakumo-brand);
  text-decoration: none;
}
.meeting-attach-download:hover,
.meeting-attach-download:focus {
  color: var(--hirakumo-brand-hover);
  text-decoration: underline;
}
.meeting-attach-download .bi-cloud-arrow-down {
  font-size: 1.2rem;
  line-height: 1;
  flex-shrink: 0;
}
.meeting-agenda-input {
  display: block;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  min-height: calc(1.45rem + 0.5rem);
  overflow-x: hidden;
  overflow-y: hidden;
  resize: none;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
  font-size: 1rem;
  line-height: 1.45rem;
  padding: 0.25rem 0.55rem !important;
  border-color: #e5e7eb;
  background: #fcfdfc;
  field-sizing: content;
}
.meeting-agenda-input:focus {
  background: #fff;
  border-color: #86c97a;
  outline: none;
  box-shadow: 0 0 0 0.2rem rgba(76, 187, 180, 0.15);
}
.meeting-attach-download {
  overflow-wrap: anywhere;
}

@media (min-width: 768px) and (max-width: 1199.98px) {
  .qm-layout .list-table .meetings-col-summary {
    display: none;
  }
}

/* 会議議事録 / 1on1 form on phones and tablets */
@media (max-width: 991.98px) {
  .qm-detail-panel .sch-user-chips-row {
    align-items: flex-start;
  }
  .qm-detail-panel .sch-user-chips {
    flex-wrap: wrap;
    overflow: visible;
    gap: 0.5rem;
  }
}
@media (max-width: 767.98px) {
  .qm-detail-panel .jm-dt-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: center;
    column-gap: 0.4rem;
    row-gap: 0.5rem;
  }
  .qm-detail-panel .jm-dt-row .sch-dt-input[type="date"] {
    width: 100%;
  }
  .qm-detail-panel .jm-hm-hour,
  .qm-detail-panel .jm-hm-minute {
    width: 4.6rem;
  }

  /* 議題・検討内容一覧: one card per agenda row instead of 4 squeezed columns */
  .meeting-agenda-table,
  .meeting-agenda-table tbody,
  .meeting-agenda-table tr,
  .meeting-agenda-table td {
    display: block;
    width: 100% !important;
    min-width: 0;
    max-width: none;
  }
  .meeting-agenda-table thead {
    display: none;
  }
  .meeting-agenda-table tbody tr {
    position: relative;
    padding: 0.5rem 0;
    border-bottom: 1px solid #f0f1f3;
  }
  .meeting-agenda-table tbody tr:last-child {
    border-bottom: 0;
  }
  .meeting-agenda-table > :not(caption) > * > * {
    padding: 0.3rem 0.85rem;
    border-bottom: 0 !important;
  }
  .meeting-agenda-table td.meeting-agenda-num {
    text-align: left;
  }
  .meeting-agenda-table td.meeting-agenda-action {
    position: absolute;
    top: 0.45rem;
    right: 0.5rem;
    width: auto !important;
    padding: 0.25rem 0.4rem;
  }
  .meeting-agenda-table td[data-label]::before {
    content: attr(data-label);
    display: block;
    margin-bottom: 0.2rem;
    font-size: var(--type-other);
    font-weight: var(--type-weight-bold);
    color: var(--hirakumo-muted);
  }
  .meeting-agenda-empty-state {
    min-height: 4.5rem;
    padding: 1.5rem 1rem;
  }
}

/* table pager — full-bleed dividers; text inset matches .list-table edge padding */
.table-pager {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-left: 0;
  margin-right: 0;
  padding-left: 1.75rem;
  padding-right: 1.75rem;
  color: #6b7280;
  font-size: 0.875rem;
  background: transparent;
}
.table-pager--top {
  padding-top: 0.7rem;
  padding-bottom: 0.7rem;
  border-bottom: 1px solid #f0f1f3;
}
.table-pager--bottom {
  padding-top: 0.7rem;
  padding-bottom: 1rem;
  border-top: 1px solid #f0f1f3;
}
.table-pager-count {
  padding-left: 0;
  font-size: 12px;
  font-weight: 450;
  flex-shrink: 0;
  white-space: nowrap;
}
.table-pager-links {
  display: flex;
  align-items: center;
  margin-left: auto;
  white-space: nowrap;
}
.table-pager-links .pagination {
  display: flex;
  flex-wrap: nowrap;
  margin-bottom: 0;
  gap: 0;
  --bs-pagination-padding-x: 0.5rem;
  --bs-pagination-padding-y: 0.45rem;
  --bs-pagination-font-size: 0.875rem;
  --bs-pagination-color: #2086A0;
  --bs-pagination-bg: #fff;
  --bs-pagination-border-width: 1px;
  --bs-pagination-border-color: #c5e0bf;
  --bs-pagination-border-radius: 0.5rem;
  --bs-pagination-hover-color: #2086A0;
  --bs-pagination-hover-bg: #e8f6e5;
  --bs-pagination-hover-border-color: #9fd494;
  --bs-pagination-focus-color: #2086A0;
  --bs-pagination-focus-bg: #e8f6e5;
  --bs-pagination-focus-box-shadow: 0 0 0 0.2rem rgba(76, 187, 180, 0.25);
  --bs-pagination-active-color: #fff;
  --bs-pagination-active-bg: #4CBBB4;
  --bs-pagination-active-border-color: #4CBBB4;
  --bs-pagination-disabled-color: #9ca3af;
  --bs-pagination-disabled-bg: #f9fafb;
  --bs-pagination-disabled-border-color: #d1d5db;
}
.table-pager-links .page-item {
  margin: 0;
}
.table-pager-links .page-link {
  width: auto;
  min-width: 2rem;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--bs-pagination-padding-y) var(--bs-pagination-padding-x);
  font-size: var(--bs-pagination-font-size);
  font-weight: 600;
  line-height: 1.5;
  white-space: nowrap;
  color: var(--bs-pagination-color);
  background-color: var(--bs-pagination-bg);
  border: 1px solid var(--bs-pagination-border-color);
  border-radius: 0 !important;
  transition: color 0.15s ease, background-color 0.15s ease, border-color 0.15s ease;
}
.table-pager-links .page-item:not(:first-child) .page-link {
  margin-left: -1px;
}
.table-pager-links .page-item:first-child .page-link {
  border-top-left-radius: var(--bs-pagination-border-radius) !important;
  border-bottom-left-radius: var(--bs-pagination-border-radius) !important;
}
.table-pager-links .page-item:last-child .page-link {
  border-top-right-radius: var(--bs-pagination-border-radius) !important;
  border-bottom-right-radius: var(--bs-pagination-border-radius) !important;
}
.table-pager-links .page-link:hover {
  z-index: 2;
  color: var(--bs-pagination-hover-color);
  background-color: var(--bs-pagination-hover-bg);
  border-color: var(--bs-pagination-hover-border-color);
}
.table-pager-links .page-link:focus {
  z-index: 3;
  color: var(--bs-pagination-focus-color);
  background-color: var(--bs-pagination-focus-bg);
  border-color: var(--bs-pagination-hover-border-color);
  box-shadow: var(--bs-pagination-focus-box-shadow);
  outline: 0;
}
.table-pager-links .page-item.active .page-link {
  z-index: 3;
  color: var(--bs-pagination-active-color);
  background-color: var(--bs-pagination-active-bg);
  border-color: var(--bs-pagination-active-border-color);
}
.table-pager-links .page-item.disabled .page-link {
  color: var(--bs-pagination-disabled-color);
  background-color: var(--bs-pagination-disabled-bg);
  border-color: var(--bs-pagination-disabled-border-color);
  pointer-events: none;
}
.table-pager-links .page-item.disabled .page-link:hover {
  color: var(--bs-pagination-disabled-color);
  background-color: var(--bs-pagination-disabled-bg);
  border-color: var(--bs-pagination-disabled-border-color);
}

/* Web video list / player */
.video-thumb {
  display: block;
  width: 100%;
  position: relative;
  overflow: hidden;
  cursor: pointer;
  background: linear-gradient(135deg, #2086A0, #4CBBB4);
}
.video-thumb-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.video-play-icon {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: 0;
  font-size: 2.25rem;
  line-height: 1;
  color: #fff;
  text-shadow: 0 2px 6px rgba(0, 0, 0, 0.4);
  pointer-events: none;
  z-index: 1;
}
.video-player-wrap {
  max-height: 70vh;
  background: #000;
}
.video-player-empty {
  height: 360px;
  min-height: 240px;
  background: #111;
}

/* Web video manage (edit full page) */
.video-manage-thumb {
  width: 80px;
  height: 46px;
  background: linear-gradient(135deg, #2086A0, #4CBBB4);
}
.video-manage-thumb-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.video-manage-thumb-fallback {
  width: 100%;
  height: 100%;
}
.video-manage-preview {
  width: 100%;
  background: #111;
}
.video-manage-preview-player {
  display: block;
  width: 100%;
  background: #000;
}
.video-manage-preview-empty {
  min-height: 140px;
  padding: 0.75rem;
  text-align: center;
  font-size: 0.8125rem;
}
@media (min-width: 992px) {
  .video-manage-form-fields {
    padding-left: 1.25rem;
  }
}
.video-manage-thumb-preview {
  width: 160px;
  height: 90px;
  object-fit: cover;
  display: block;
}
.video-category-select--new {
  color: var(--hirakumo-brand);
  font-weight: 600;
}
.video-category-group > h3 {
  color: #333;
}
.video-card-title {
  color: #333;
  font-weight: 500;
}

/* Accent-2 action (was Bootstrap blue; keep distinct from brand teal) */
.btn-blue {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--hirakumo-accent2);
  --bs-btn-border-color: var(--hirakumo-accent2);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #006A80;
  --bs-btn-hover-border-color: #006A80;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #006A80;
  --bs-btn-active-border-color: #006A80;
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: var(--hirakumo-disabled);
  --bs-btn-disabled-border-color: var(--hirakumo-disabled);
}
/* Excelエクスポート — grey 600 / white text */
.btn-excel-export {
  --bs-btn-color: #fff;
  --bs-btn-bg: #757575;
  --bs-btn-border-color: #757575;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #616161;
  --bs-btn-hover-border-color: #616161;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #616161;
  --bs-btn-active-border-color: #616161;
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: var(--hirakumo-disabled);
  --bs-btn-disabled-border-color: var(--hirakumo-disabled);
}
/* Excelインポート — accent 800 / white text */
.btn-excel-import {
  --bs-btn-color: #fff;
  --bs-btn-bg: #0086A0;
  --bs-btn-border-color: #0086A0;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #006A80;
  --bs-btn-hover-border-color: #006A80;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #006A80;
  --bs-btn-active-border-color: #006A80;
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: var(--hirakumo-disabled);
  --bs-btn-disabled-border-color: var(--hirakumo-disabled);
}
.text-blue { color: var(--hirakumo-accent2) !important; }
.btn-link.text-blue:hover { color: #006A80 !important; }

/* Employee history tabs */
.emp-hist-tabs-row {
  border-bottom: 1px solid #dee2e6;
}
.emp-hist-tabs {
  border-bottom: none;
  gap: 0.15rem;
  flex: 1 1 auto;
  min-width: 0;
}
.emp-hist-tabs .nav-link {
  color: #6b7280;
  background: transparent;
  border: 1px solid transparent;
  border-top-left-radius: 0.45rem;
  border-top-right-radius: 0.45rem;
  font-weight: 600;
  font-size: 0.875rem;
  padding: 0.65rem 1.1rem;
  margin-bottom: -1px;
}
.emp-hist-tabs .nav-link:hover {
  color: #333;
  background: #f8faf9;
  border-color: #e5e7eb #e5e7eb transparent;
}
.emp-hist-tabs .nav-link.active {
  color: #333;
  /* Match .page-content .table thead th so the selected tab aligns with the history table header */
  background: #e4e8e5;
  border-color: #dee2e6 #dee2e6 #e4e8e5;
}

/* Company master — 理念・ポリシー register tabs */
.cm-policy-tabs {
  /* Full-width underline across the card (cancel header side padding) */
  width: calc(100% + 2.3rem);
  margin-left: -1.15rem;
  margin-right: -1.15rem;
  padding-left: 1.15rem;
  padding-right: 1.15rem;
  border-bottom: 1px solid #dee2e6;
  gap: 0.15rem;
}
.cm-policy-tabs .nav-link {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  color: #6b7280;
  background: transparent;
  border: 1px solid transparent;
  border-top-left-radius: 0.45rem;
  border-top-right-radius: 0.45rem;
  font-weight: 600;
  font-size: 0.875rem;
  padding: 0.65rem 1.1rem;
  margin-bottom: -1px;
}
.cm-policy-tabs .nav-link .card-icon {
  font-size: 1rem;
  line-height: 1;
}
.cm-policy-tabs .nav-link:hover {
  color: #333;
  background: #f8faf9;
  border-color: #e5e7eb #e5e7eb transparent;
}
.cm-policy-tabs .nav-link.active {
  color: #333;
  background: #fff;
  border-color: #dee2e6 #dee2e6 #fff;
}
.emp-hist-add-btn {
  flex-shrink: 0;
  margin-bottom: 0.5rem !important;
}
.emp-hist-panel {
  background: #fff;
  border-color: #dee2e6 !important;
  overflow: hidden;
}
.emp-hist-toolbar {
  padding: 0.85rem var(--list-pad-edge, 1.75rem) 0.85rem;
}
/* Shared column grid across role / dept / grade history tables */
.emp-hist-table {
  table-layout: fixed;
  width: 100%;
}
.emp-hist-table .emp-hist-col-date {
  width: 8rem;
}
.emp-hist-table .emp-hist-col-main {
  width: 28%;
}
.emp-hist-table .emp-hist-col-note {
  width: auto;
}
.emp-hist-table .emp-hist-col-actions {
  width: 11.5rem;
}
.emp-hist-table thead th {
  border-top: none !important;
  border-bottom: none !important;
}
.emp-hist-table thead tr {
  background-image:
    linear-gradient(#eef0f2, #eef0f2),
    linear-gradient(#eef0f2, #eef0f2);
  background-size: calc(100% - 2.5rem) 1px;
  background-position: 1.25rem top, 1.25rem bottom;
  background-repeat: no-repeat;
}
.emp-hist-table tbody tr:last-child > * {
  border-bottom: none !important;
}

/* Employee list toolbar: title | filters | actions (actions stay top-right) */
.emp-list-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 0.75rem;
}
.emp-list-title {
  flex: 0 0 auto;
}
.emp-list-filters {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 0.75rem;
  flex: 1 1 auto;
  min-width: 0;
}
.emp-list-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.5rem;
  flex: 0 0 auto;
  margin-left: auto;
}

/* Narrow / small laptop: keep actions on the first row (top-right) */
@media (max-width: 1399.98px) {
  .emp-list-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
      "title actions"
      "filters filters";
    align-items: center;
    column-gap: 0.75rem;
    row-gap: 0.65rem;
  }
  .emp-list-title { grid-area: title; }
  .emp-list-actions {
    grid-area: actions;
    margin-left: 0;
  }
  .emp-list-filters {
    grid-area: filters;
    flex: 1 1 auto;
    width: 100%;
  }
  .emp-list-search {
    width: min(290px, 100%);
    flex: 1 1 12rem;
    max-width: 290px;
  }
}

/* Employee list toolbar: search + age update aligned */
.emp-list-search {
  width: 290px;
}
.emp-list-search-icon {
  pointer-events: none;
  font-size: 0.875rem;
}
.emp-list-search-input {
  padding-left: 2rem !important;
  min-height: 2.5rem !important;
  height: 2.5rem;
  box-sizing: border-box;
}

/* Age as-of date + update as one control */
.emp-age-update {
  width: auto;
  flex-wrap: nowrap;
  height: 2.5rem;
}

.emp-excel-type {
  width: auto;
  min-width: 9.5rem;
}

.emp-age-update > .form-control {
  width: 9.5rem;
  min-height: 2.5rem !important;
  height: 2.5rem;
  border-color: #ced4da;
  border-top-right-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
  box-sizing: border-box;
}
.emp-age-update > .btn {
  --bs-btn-color: #495057;
  --bs-btn-bg: #f3f4f6;
  --bs-btn-border-color: #ced4da;
  --bs-btn-hover-color: #333;
  --bs-btn-hover-bg: #e5e7eb;
  --bs-btn-hover-border-color: #ced4da;
  --bs-btn-active-color: #333;
  --bs-btn-active-bg: #d1d5db;
  --bs-btn-active-border-color: #ced4da;
  min-height: 2.5rem;
  height: 2.5rem;
  padding-top: 0;
  padding-bottom: 0;
  display: inline-flex;
  align-items: center;
  font-size: 0.875rem;
  font-weight: 600;
  white-space: nowrap;
  border-top-left-radius: 0 !important;
  border-bottom-left-radius: 0 !important;
  border-top-right-radius: var(--shell-input-radius, 0.5rem) !important;
  border-bottom-right-radius: var(--shell-input-radius, 0.5rem) !important;
  margin-left: -1px;
  box-sizing: border-box;
}

/* Phones: title / actions / filters stacked (must follow the base toolbar rules) */
@media (max-width: 575.98px) {
  .emp-list-head {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas:
      "title"
      "actions"
      "filters";
  }
  .emp-list-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.4rem;
    width: 100%;
  }
  .emp-list-actions .btn {
    width: 100%;
    min-width: 0;
    padding-inline: 0.4rem;
    white-space: nowrap;
  }
  .emp-list-actions .btn:first-child {
    grid-column: 1 / -1;
  }
  .emp-list-filters > * {
    flex: 1 1 100%;
    min-width: 0;
  }
  .emp-list-search {
    width: 100%;
    max-width: none;
  }
  .emp-age-update {
    width: 100%;
  }
  .emp-age-update > .form-control {
    flex: 1 1 0;
    width: auto;
    min-width: 0;
  }
}

/* Pin アクション to the right like 組織図一覧; leftover width goes to 氏名 */
.emp-admin-table {
  table-layout: fixed;
  width: 100%;
}
.emp-admin-table .emp-list-col-no { width: 7rem; }
.emp-admin-table .emp-list-col-name { width: auto; }
.emp-admin-table .emp-list-col-birth { width: 8rem; }
.emp-admin-table .emp-list-col-age { width: 5rem; }
.emp-admin-table .emp-list-col-hire { width: 8rem; }
.emp-admin-table .emp-list-col-service { width: 6.5rem; }
.emp-admin-table .emp-list-col-actions { width: 11.5rem; }
.emp-admin-table .emp-col-name {
  padding-right: 0.35rem !important;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Keep 部署 / 役職 / 権限 centered and compact */
.emp-admin-table .emp-col-authority,
.emp-admin-table .emp-col-dept,
.emp-admin-table .emp-col-role {
  width: 8.5rem;
  white-space: nowrap;
  text-align: center !important;
}
.emp-admin-table .emp-col-dept {
  padding-right: 0.35rem !important;
}
.emp-admin-table .emp-col-role {
  padding-left: 0.35rem !important;
  padding-right: 0.35rem !important;
}
.emp-admin-table .emp-col-authority {
  padding-left: 0.35rem !important;
}

/* 1on1 detail/edit — fixed label column so emoji labels don't push values */
.oneonone-field {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  margin-bottom: 0.85rem;
  font-size: 1rem;
}
.oneonone-field__label {
  flex: 0 0 8.5rem;
  width: 8.5rem;
  max-width: 8.5rem;
  font-weight: 600;
  line-height: 1.5;
  padding-top: 0.35rem;
}
.oneonone-field__label--muted {
  color: #6c757d;
}
.oneonone-field__value {
  flex: 1 1 auto;
  min-width: 0;
  line-height: 1.5;
  padding-top: 0;
}
.oneonone-field__value > .sch-inline-chips {
  min-height: var(--sch-select-chip-h);
}
.oneonone-field__text {
  white-space: pre-wrap;
  padding-top: 0.35rem;
}
.oneonone-field .form-control {
  background-color: #fff;
}
@media (max-width: 575.98px) {
  .oneonone-field {
    flex-direction: column;
    gap: 0.25rem;
  }
  .oneonone-field__label {
    flex-basis: auto;
    width: auto;
    max-width: none;
    padding-top: 0;
  }
  .oneonone-field__value {
    padding-top: 0;
  }
}
.sch-inline-chips {
  gap: 0.5rem !important;
}
.sch-inline-chips > .sch-ftab {
  margin-right: 0.15rem;
}
@media (pointer: coarse) {
  /* Bigger tap area for the tiny chip ✕; negative margin keeps the chip size */
  .sch-inline-chips .btn-close,
  .sch-place-chip .btn-close,
  .dest-selected-chips .btn-close {
    padding: 0.55rem !important;
    margin: -0.45rem -0.45rem -0.45rem 0;
  }
}

/* Shared select-chip height (room + user tags) */
:root {
  --sch-select-chip-h: calc(1.5em + 0.75rem + 2px);
  --sch-select-chip-pad-y: 0.35rem;
  --sch-select-chip-pad-x: 0.7rem;
}

.sch-place-row {
  min-height: var(--sch-select-chip-h);
}
/* スケジュール / 設備予約: button left, room chips wrap in the right column */
.sch-place-row:has(.sch-place-chips) {
  display: flex;
  flex-wrap: nowrap;
  align-items: flex-start;
  gap: 0.5rem;
  min-width: 0;
  max-width: 100%;
}
.sch-place-row:has(.sch-place-chips) > .sch-ftab {
  flex: 0 0 auto;
}
.sch-place-chips {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
}
.sch-ftab.btn-sm {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  min-height: var(--sch-select-chip-h) !important;
  height: var(--sch-select-chip-h);
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  line-height: 1.25 !important;
}
.sch-place-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  min-height: var(--sch-select-chip-h);
  padding: var(--sch-select-chip-pad-y) var(--sch-select-chip-pad-x);
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.5;
  border: 1px solid var(--hirakumo-facility);
  border-radius: 0.375rem;
  background: var(--hirakumo-facility);
  color: #fff;
  box-sizing: border-box;
}
.sch-place-chip .sch-place-label {
  max-width: 28rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #fff;
}
.sch-place-chip .btn-close {
  filter: invert(1) grayscale(100%) brightness(200%);
  opacity: 0.85;
}
.sch-place-chip .btn-close:hover {
  opacity: 1;
}

/* Selected-user (従業員) tags — Accent 900, distinct from 保存 (brand) */
.sch-inline-chips .badge.text-bg-success,
.dest-field-summary .badge.text-bg-success,
.dest-selected-chips .badge.text-bg-success,
.meeting-agenda-owner .badge.text-bg-success,
.sch-detail-people .badge.text-bg-success {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  min-height: var(--sch-select-chip-h);
  padding: var(--sch-select-chip-pad-y) var(--sch-select-chip-pad-x);
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.5;
  border-radius: 0.375rem;
  box-sizing: border-box;
  background-color: var(--hirakumo-employee) !important;
  color: #fff !important;
}
.badge.text-bg-success,
.text-bg-success {
  color: #fff !important;
  background-color: var(--hirakumo-employee) !important;
}
/* Guest (system-外) chips — accent2 to stay in palette while distinct from employee brand */
.sch-inline-chips .badge.sch-guest-chip,
.sch-detail-people .badge.sch-guest-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  min-height: var(--sch-select-chip-h);
  padding: var(--sch-select-chip-pad-y) var(--sch-select-chip-pad-x);
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.5;
  border-radius: 0.375rem;
  box-sizing: border-box;
  background-color: var(--hirakumo-accent2) !important;
  color: #fff !important;
}
.sch-inline-chips .badge.text-bg-success .btn-close,
.dest-field-summary .badge.text-bg-success .btn-close,
.dest-selected-chips .badge.text-bg-success .btn-close,
.meeting-agenda-owner .badge.text-bg-success .btn-close,
.sch-inline-chips .badge.sch-guest-chip .btn-close {
  font-size: 0.55rem;
  opacity: 0.85;
}
.sch-inline-chips .badge.text-bg-success .btn-close:hover,
.dest-field-summary .badge.text-bg-success .btn-close:hover,
.dest-selected-chips .badge.text-bg-success .btn-close:hover,
.meeting-agenda-owner .badge.text-bg-success .btn-close:hover,
.sch-inline-chips .badge.sch-guest-chip .btn-close:hover {
  opacity: 1;
}

/* Many selected employees: one row + horizontal scroll so the form footer stays clickable */
.sch-form-modal .row > [class*="col-"]:has(.sch-user-chips),
.row > [class*="col-"]:has(.sch-user-chips),
.row > [class*="col-"]:has(.sch-user-chips-row) {
  min-width: 0;
}
.sch-user-chips-row {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.5rem;
  min-width: 0;
  max-width: 100%;
}
/* スケジュール / 設備予約: wrap chips like irregular dates (no horizontal scroll) */
.sch-form-modal .sch-user-chips-row {
  align-items: flex-start;
}
.sch-form-modal .sch-user-chips {
  flex-wrap: wrap;
  overflow: visible;
  overflow-x: visible;
  padding-bottom: 0;
  gap: 0.5rem;
}
.sch-guest-participant-row {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.5rem;
  max-width: 16rem;
}
.sch-guest-participant-row > .form-control {
  min-width: 0;
  flex: 1 1 auto;
  height: calc(1.5em + 0.4rem + 2px);
  padding-top: 0.2rem;
  padding-bottom: 0.2rem;
  font-size: 0.8125rem;
}
.sch-guest-name {
  color: var(--hirakumo-accent2);
  font-weight: 600;
}
/* 対象者: 全社員 / 選択 + 従業員 picker — first line matches form-control-sm height */
.target-mode-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  column-gap: 1rem;
  row-gap: 0.35rem;
  min-width: 0;
  max-width: 100%;
  /* Same height as .form-control-sm so 対象者 label lines up with other fields */
  min-height: calc(1.5em + 0.5rem + 2px);
}
.target-mode-option {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  min-height: 1rem;
  padding-left: 1.5em;
  margin-bottom: 0 !important;
  margin-top: 0 !important;
}
.target-mode-option .form-check-input {
  float: none;
  margin-top: 0;
  margin-left: -1.5em;
  flex-shrink: 0;
  position: relative;
}
.target-mode-option .form-check-label {
  margin-bottom: 0;
  line-height: 1.25;
  cursor: pointer;
  padding-top: 0;
  padding-bottom: 0;
}
.target-mode-select-group {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  min-width: 0;
  flex: 0 1 auto;
}
.target-mode-pick-btn {
  height: calc(1.5em + 0.5rem + 2px) !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  display: inline-flex !important;
  align-items: center;
  line-height: 1.25 !important;
  box-sizing: border-box;
}
.target-mode-label {
  min-height: calc(1.5em + 0.5rem + 2px);
}
.target-mode-selected {
  margin-top: 0.5rem;
}
.sch-user-chips {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.25rem;
  min-width: 0;
  flex: 1 1 auto;
  max-width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  padding-bottom: 2px;
  -webkit-overflow-scrolling: touch;
}
.sch-user-chips > .badge {
  flex: 0 0 auto;
  white-space: nowrap;
}

/* Irregular schedule: button left, dates wrap in the right column only */
.sch-irr-row {
  display: flex;
  flex-wrap: nowrap;
  align-items: flex-start;
  gap: 0.5rem;
  min-width: 0;
  max-width: 100%;
}
.sch-irr-row > .sch-ftab {
  flex: 0 0 auto;
}
.sch-irr-row .sch-irr-chips {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem !important;
}

/* Irregular schedule date chips — same size as 登録先 tags, soft brand fill */
.sch-irr-chips .badge.sch-irr-date-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  min-height: var(--sch-select-chip-h);
  padding: var(--sch-select-chip-pad-y) var(--sch-select-chip-pad-x);
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.5;
  border-radius: 0.375rem;
  box-sizing: border-box;
  background-color: var(--hirakumo-focus-fill) !important;
  color: var(--hirakumo-accent2) !important;
}
.sch-irr-chips .badge.sch-irr-date-chip .btn-close {
  font-size: 0.55rem;
  opacity: 0.65;
  filter: none;
}
.sch-irr-chips .badge.sch-irr-date-chip .btn-close:hover {
  opacity: 1;
}

.password-input-wrap {
  position: relative;
  width: 100%;
  max-width: 100%;
}
.password-input-wrap .password-input-field {
  padding-right: 2.5rem;
}
.password-input-wrap .password-toggle-btn {
  position: absolute;
  top: 50%;
  right: 0.35rem;
  transform: translateY(-50%);
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  padding: 0;
  border: 0;
  background: transparent;
  color: #6b7280;
  line-height: 1;
  cursor: pointer;
}
.password-input-wrap .password-toggle-btn:hover,
.password-input-wrap .password-toggle-btn:focus-visible {
  color: #333;
  outline: none;
}
.password-input-wrap .password-toggle-btn .bi {
  font-size: 1rem;
}

/* ── 文書一覧: folder tree + list ── */
/* Keep card corner radius; sticky-thead normally forces overflow:visible. */
.qm-list-panel > .dash-card:has(.docs-browse) {
  overflow: hidden !important;
  border-radius: 16px !important;
}
.docs-browse {
  display: flex;
  align-items: stretch;
  min-height: 24rem;
}
.docs-tree-panel {
  flex: 0 0 17rem;
  width: 17rem;
  max-width: 17rem;
  border-right: none;
  background: #fff !important;
  display: flex;
  flex-direction: column;
  min-height: 0;
  height: auto;
  position: relative;
  z-index: 1;
}
.docs-tree-panel::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  width: 1px;
  border-radius: 0;
  background: #d1d5db;
  pointer-events: none;
}
.docs-browse-head {
  flex: 0 0 auto;
  box-sizing: border-box;
  min-height: 3.5rem;
  display: flex;
  align-items: center;
  margin: 0 !important;
  padding: 0.65rem 0.85rem !important;
  border-bottom: none !important;
  background: #fff;
}
.docs-tree-toolbar.docs-browse-head {
  justify-content: flex-start;
  max-width: 100%;
}
.docs-tree-toolbar .btn {
  flex: 0 0 auto;
  width: auto;
  max-width: 100%;
  white-space: nowrap;
}
.docs-list-main > .docs-browse-head.dash-card-head {
  border-radius: 0 !important;
}
.docs-tree-scroll {
  overflow-x: auto;
  overflow-y: auto;
  flex: 1 1 auto;
  min-height: 16rem;
  max-height: calc(100vh - 14rem);
  padding: 0.35rem 0;
}
.docs-tree-panel .docs-tree-scroll .dest-tree-item {
  flex-wrap: nowrap;
  white-space: nowrap;
  width: max-content;
  min-width: 100%;
  border-radius: 0;
  padding-left: 0.85rem;
  padding-right: 0.85rem;
}
.docs-tree-panel .docs-tree-name {
  flex: 0 0 auto;
  white-space: nowrap;
}
.docs-tree-panel .docs-tree-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 1.25rem;
  width: 1.25rem;
  height: 1.25rem;
  box-sizing: border-box;
  padding: 0;
  margin: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #6b7280;
  font-size: 0;
  line-height: 1;
  text-decoration: none !important;
  box-shadow: none;
  cursor: pointer;
  position: relative;
  appearance: none;
  -webkit-appearance: none;
}
.docs-tree-panel .docs-tree-toggle:hover,
.docs-tree-panel .docs-tree-toggle:focus-visible {
  background: transparent;
  color: #333;
  outline: none;
}
.docs-tree-panel .docs-tree-toggle .bi {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  line-height: 1;
  width: 100%;
  height: 100%;
}
.docs-tree-panel .docs-tree-toggle-spacer {
  display: inline-block;
  flex: 0 0 1.25rem;
  flex-shrink: 0;
  width: 1.25rem;
  height: 1.25rem;
  box-sizing: border-box;
}
.docs-tree-panel .docs-tree-edit {
  flex: 0 0 auto;
  color: #6b7280 !important;
  text-decoration: none !important;
  line-height: 1;
  font-size: 0.8rem;
  opacity: 0.7;
  box-shadow: none;
}
.docs-tree-panel .docs-tree-edit:hover {
  color: var(--hirakumo-brand) !important;
  opacity: 1;
}
.docs-tree-panel .dest-tree-item.is-active .docs-tree-edit {
  color: var(--hirakumo-accent2) !important;
}
.docs-list-main {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
}
/* Tablets too: a 17rem tree beside the list leaves only a few characters for 文書名 */
@media (max-width: 991.98px) {
  .docs-browse {
    flex-direction: column;
  }
  .docs-tree-panel {
    flex: 0 0 auto;
    width: 100%;
    max-width: none;
    border-right: none;
    border-bottom: none;
  }
  .docs-tree-panel::after {
    display: none;
  }
  .docs-tree-scroll {
    max-height: 12rem;
    min-height: 8rem;
  }
}
@media (pointer: coarse) {
  .docs-tree-panel .docs-tree-edit {
    padding: 0.5rem !important;
    font-size: 1rem;
    opacity: 1;
  }
  .docs-tree-panel .docs-tree-toggle,
  .docs-tree-panel .docs-tree-toggle-spacer {
    flex-basis: 2rem;
    width: 2rem;
    height: 2rem;
  }
}

/* ── 文書一覧: fixed columns so folder / file rows stay aligned ── */
.docs-list-table {
  table-layout: fixed;
  width: 100%;
}
.docs-list-search,
.meetings-list-search {
  width: 290px;
}
.docs-list-search-icon,
.meetings-list-search-icon {
  pointer-events: none;
  font-size: 0.875rem;
}
.docs-list-search-input,
.meetings-list-search-input {
  padding-left: 2rem !important;
  min-height: 2.5rem !important;
  height: 2.5rem;
  box-sizing: border-box;
}

@media (max-width: 1399.98px) {
  .docs-list-search,
  .meetings-list-search {
    width: min(290px, 100%);
    flex: 1 1 12rem;
    max-width: 290px;
  }
}

@media (max-width: 575.98px) {
  .docs-list-search,
  .meetings-list-search {
    max-width: none;
    width: 100%;
    flex: 1 1 100%;
  }
}
.docs-list-table .docs-col-name {
  width: auto;
}
.docs-list-table .docs-col-owner {
  width: 8rem;
}
.docs-list-table .docs-col-date {
  /* Y/m/d + list edge padding — keep 登録日 on one line */
  width: 10rem;
}
.docs-list-table .docs-col-actions {
  width: 8.5rem;
}
.docs-list-table .docs-col-meta,
.docs-list-table th.docs-col-meta,
.docs-list-table td.docs-col-meta {
  text-align: left !important;
}
.docs-list-table col.docs-col-date,
.docs-list-table th:nth-child(3),
.docs-list-table td:nth-child(3),
.docs-list-table td[data-label="登録日"] {
  white-space: nowrap;
}
.docs-list-table td:nth-child(1),
.docs-list-table th:nth-child(1) {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
@media (max-width: 767.98px) {
  .docs-list-table {
    table-layout: auto;
  }
  .docs-list-table td:nth-child(1),
  .docs-list-table th:nth-child(1) {
    white-space: normal;
  }
  .docs-list-table .docs-col-meta,
  .docs-list-table th.docs-col-meta,
  .docs-list-table td.docs-col-meta {
    text-align: left !important;
  }
}

/* Dashboard policy card tabs (人事 / ワーク) */
.dash-policy-tabs {
  border-bottom: 1px solid #e8eaed;
}
.dash-policy-tabs .nav-link {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.8125rem;
  font-weight: 600;
  color: #6b7280;
  border: none;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  padding: 0.4rem 0.75rem;
  background: transparent;
}
.dash-policy-tabs .nav-link .card-icon {
  font-size: 1rem;
  line-height: 1;
}
.dash-policy-tabs .nav-link:hover {
  color: #4CBBB4;
  border-color: transparent;
}
.dash-policy-tabs .nav-link.active {
  color: #4CBBB4;
  background: transparent;
  border-bottom-color: #4CBBB4;
}

/* ── 評価 / 評価管理（prototype: 給与・賞与 + role colors） ── */
.eval-tabs {
  display: flex;
  gap: 4px;
  padding: 0 4px;
  border-bottom: 1px solid #e5e7eb;
  background: #f9fafb;
  border-radius: 8px 8px 0 0;
}
.eval-tab {
  padding: 12px 18px;
  font-size: 13px;
  font-weight: 600;
  color: #6b7280;
  cursor: pointer;
  border: none;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
  background: none;
  font-family: inherit;
}
.eval-tab:hover { color: #333; }
.eval-tab.active {
  color: #0086A0;
  border-bottom-color: #4CBBB4;
  background: #fff;
}
.eval-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.2rem 0.55rem;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: 0.02em;
}
.eval-badge--employee { background: var(--hirakumo-role-employee); color: #ffffff; }
.eval-badge--manager1 { background: var(--hirakumo-role-manager1); color: #ffffff; }
.eval-badge--manager2 { background: var(--hirakumo-role-manager2); color: #ffffff; }
.eval-badge--action { background: #E6F7F5; color: #0086A0; }
.eval-badge--done { background: #E6F7F5; color: #0086A0; }
.eval-badge--early { background: var(--hirakumo-focus-fill); color: var(--hirakumo-accent2); }
.eval-badge--late { background: #FFF7EB; color: #D49A1A; }
.eval-badge--locked { background: #e5e7eb; color: #4b5563; }
.eval-badge--draft { background: #f3f4f6; color: #333; }
.eval-breadcrumb {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.8125rem;
}
.eval-breadcrumb-link {
  border: none;
  background: none;
  padding: 0;
  color: var(--hirakumo-brand);
  font-weight: 600;
  cursor: pointer;
  font-size: inherit;
  font-family: inherit;
}
.eval-breadcrumb-link:hover { text-decoration: underline; }
.eval-breadcrumb-sep { color: #d1d5db; }
.eval-breadcrumb-current { color: #333; font-weight: 700; }
.eval-period-summary-inline {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
}
.eval-bonus-explain {
  background: #E6F7F5;
  border: 1px solid #A8DCE1;
  border-radius: 8px;
  padding: 0.85rem 1rem;
  font-size: 0.8125rem;
  color: #006A80;
}
/* 評価管理: breathing room under page title + gap under explain box */
.eval-manage-page {
  padding-top: 0.35rem;
}
/* Don’t pad tab headers — they must sit flush like 社員マスタ */
.eval-manage-page > .dash-card > .dash-card-head:first-child:not(.pb-0) {
  padding-top: 1.15rem !important;
}
.eval-manage-page .eval-bonus-explain {
  margin-bottom: 1rem;
}
.eval-bonus-explain-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 1.25rem;
  margin-bottom: 0.35rem;
}
.eval-bonus-formula {
  margin-top: 0.35rem;
  font-weight: 600;
  color: #0086A0;
}
.eval-salary-period-hint {
  color: #6b7280;
  line-height: 1.45;
}
.eval-salary-link {
  color: #2f6b28 !important;
  font-weight: 600;
}
.eval-salary-link:hover {
  color: #246b1f !important;
}
.eval-form-preview ul { color: #4b5563; }
.eval-form-builder-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}
.eval-period-meta-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem 1.25rem;
  width: 100%;
  min-width: 0;
}
.eval-period-meta-actions {
  margin-left: auto;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.5rem;
  flex-shrink: 0;
}
.eval-period-meta-field {
  display: grid;
  grid-template-columns: auto minmax(0, max-content);
  align-items: center;
  column-gap: 0.65rem;
  row-gap: 0.25rem;
  min-width: 0;
  max-width: 100%;
  width: auto;
  flex: 0 0 auto;
}
.eval-period-meta-field > .eval-period-meta-label {
  grid-column: 1;
  grid-row: 1;
}
.eval-period-meta-field > .eval-period-name-wrap,
.eval-period-meta-field > .eval-period-date-input,
.eval-period-meta-field > .eval-period-range,
.eval-period-meta-field > .eval-period-meta-readonly,
.eval-period-meta-field > .eval-period-name-input,
.eval-period-meta-field > .eval-period-form-label-input {
  grid-column: 2;
  grid-row: 1;
}
.eval-period-form-label-input {
  width: 14rem;
  max-width: 20rem;
  min-width: 10rem;
}
.eval-period-meta-readonly {
  font-size: var(--type-body);
  font-weight: 600;
  color: #333;
  line-height: 1.5;
  padding: 0.2rem 0;
  white-space: nowrap;
}
.eval-period-range {
  display: inline-flex;
  align-items: center;
  flex-wrap: nowrap;
  gap: 0.4rem 0.5rem;
  min-width: 0;
}
.eval-period-range--inline {
  flex-wrap: nowrap;
  width: auto;
  max-width: 100%;
}
.eval-period-range--inline > .form-control {
  width: auto;
  flex: 0 0 auto;
  min-width: 10.5rem;
}
.eval-period-range-sep {
  color: #6b7280;
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1;
  user-select: none;
}
.eval-period-meta-field.has-error .eval-period-name-input,
.eval-period-meta-field.has-error .eval-period-date-input,
.eval-assign-row.has-error .eval-period-date-input,
.eval-period-name-input.is-invalid,
.eval-period-date-input.is-invalid,
input[type="date"].is-invalid,
input[type="datetime-local"].is-invalid {
  border-color: #B81C22 !important;
  background-color: #fff5f5;
  box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.15);
}
.eval-period-meta-error {
  grid-column: 2;
  grid-row: 2;
  width: max-content;
  max-width: min(20rem, 70vw);
  color: #B81C22;
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 1.35;
  margin: 0;
}
.eval-period-meta-label {
  margin: 0;
  font-size: var(--type-body);
  font-weight: 600;
  color: #333;
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  gap: 0.15rem;
}
.eval-period-meta-label .badge {
  font-size: 0.75em;
  font-weight: 400;
}
.eval-period-name-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
  min-width: 0;
}
.eval-period-name-sizer {
  position: absolute;
  top: 0;
  left: 0;
  visibility: hidden;
  white-space: pre;
  height: 0;
  overflow: hidden;
  pointer-events: none;
}
.eval-period-name-input {
  min-width: 10rem;
  max-width: 32.5rem;
  width: 10rem;
  box-sizing: border-box;
}
.eval-period-date-input {
  width: 9.5rem;
  max-width: 9.5rem;
  box-sizing: border-box;
}
.eval-assign-modal {
  --bs-modal-width: 40rem;
  max-width: 40rem;
}
.eval-assign-list-table .eval-assign-col-status,
.eval-assign-list-table .list-col-actions {
  text-align: center !important;
  border-left: none !important;
  border-right: none !important;
  box-shadow: none !important;
}
.eval-assign-list-table .list-col-actions {
  width: 11.5rem;
}
.eval-salary-score-table {
  table-layout: fixed;
}
.eval-salary-score-table col.eval-salary-col-axis {
  width: 8.5rem;
}
.eval-salary-score-table col.eval-salary-col-num {
  width: 2.75rem;
}
.eval-salary-score-table .eval-salary-col-num,
.eval-salary-score-table th.eval-salary-col-num,
.eval-salary-score-table td.eval-salary-col-num {
  width: 2.75rem;
  min-width: 2.75rem;
  max-width: 2.75rem;
  padding-left: 0.35rem !important;
  padding-right: 0.35rem !important;
  text-align: center !important;
  white-space: nowrap;
  vertical-align: middle;
  box-sizing: border-box;
}
.eval-salary-score-table tbody td.eval-salary-col-num:first-child {
  padding-left: 0.35rem !important;
  text-align: center !important;
}

.eval-salary-detail {
  padding-top: 0.85rem;
}
.eval-salary-detail .eval-salary-score-table thead th,
.eval-salary-detail .eval-salary-compare-table thead th,
.eval-salary-detail .eval-salary-rank-ref-table thead th {
  background: var(--hirakumo-focus-fill) !important;
  color: var(--hirakumo-accent2) !important;
  font-weight: var(--type-weight-bold) !important;
  border-bottom-color: var(--hirakumo-brand) !important;
}
.eval-salary-rank-ref-table .eval-rank-col-rank {
  width: 34%;
}
.eval-salary-rank-ref-table .eval-rank-col-score,
.eval-salary-rank-ref-table .eval-rank-col-normal {
  width: 33%;
}
.eval-salary-detail .list-table thead th {
  padding-top: 0.55rem !important;
  padding-bottom: 0.55rem !important;
  line-height: 1.35;
}
.eval-salary-detail .list-table tbody td {
  padding-top: 0.22rem !important;
  padding-bottom: 0.22rem !important;
  line-height: 1.25;
}
.eval-salary-detail .eval-salary-score-table tbody tr.eval-salary-total-row > *,
.eval-salary-detail .eval-salary-compare-table tbody tr.eval-salary-increase-row > * {
  background: transparent !important;
  color: var(--hirakumo-ink) !important;
  font-weight: 700;
}
.eval-salary-detail .eval-salary-allowance-input {
  max-width: 6.5rem;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  padding-top: 0.15rem;
  padding-bottom: 0.15rem;
}
.eval-salary-rank-toggle {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.eval-salary-rank-toggle__btn {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.2rem 0.65rem;
  border: 1px solid #d4ddd2;
  border-radius: 0.4rem;
  background: #fff;
  color: #1f4d32;
  font-size: 0.8125rem;
  font-weight: 600;
  line-height: 1.3;
}
.eval-salary-rank-toggle__btn:hover,
.eval-salary-rank-toggle__btn:focus {
  background: #f4faf4;
  border-color: #b7d7c3;
  color: #1f4d32;
}
.eval-salary-rank-modal {
  position: fixed;
  inset: 0;
  z-index: 2450;
  display: block;
  padding: 0;
  pointer-events: none;
}
.eval-salary-rank-modal__panel {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 1;
  width: min(32rem, 92vw);
  max-height: none;
  overflow: visible;
  pointer-events: auto;
  background: #fff;
  border: 1px solid #d4ddd2;
  border-radius: 0.5rem;
  box-shadow: 0 12px 40px rgba(15, 23, 42, 0.22);
  padding: 1rem 1.15rem 1.15rem;
}
.eval-salary-rank-modal__panel.is-dragging {
  box-shadow: 0 16px 48px rgba(15, 23, 42, 0.28);
  user-select: none;
}
.eval-salary-rank-modal__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.75rem;
  margin: -1rem -1.15rem 0.75rem;
  padding: 0.7rem 1.15rem;
  cursor: grab;
  touch-action: none;
  user-select: none;
  border-bottom: 1px solid #e5ebe4;
  border-radius: 0.5rem 0.5rem 0 0;
  background: #f7faf6;
}
.eval-salary-rank-modal__panel.is-dragging .eval-salary-rank-modal__head {
  cursor: grabbing;
}
.eval-salary-rank-modal__head .btn {
  cursor: pointer;
  touch-action: auto;
}
.eval-salary-rank-modal__title {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 700;
  color: #333;
}
.eval-salary-rank-modal .eval-salary-rank-ref-table {
  table-layout: fixed;
  width: 100%;
}
.eval-salary-rank-modal .eval-salary-rank-ref-table .eval-rank-col-rank,
.eval-salary-rank-modal .eval-salary-rank-ref-table .eval-rank-col-score,
.eval-salary-rank-modal .eval-salary-rank-ref-table .eval-rank-col-normal {
  width: 33.333% !important;
}
.eval-salary-rank-modal .list-table thead th,
.eval-salary-rank-modal .list-table tbody td,
.eval-salary-rank-modal .list-table > :not(caption) > * > *:first-child,
.eval-salary-rank-modal .list-table > :not(caption) > * > *:last-child {
  width: 33.333%;
  padding: 0.42rem 0.65rem !important;
  line-height: 1.4;
  font-size: var(--list-font, 0.875rem) !important;
  text-align: center !important;
}
.eval-salary-rank-modal .eval-salary-rank-ref-table thead th {
  background: var(--hirakumo-focus-fill) !important;
  color: var(--hirakumo-accent2) !important;
  font-weight: var(--type-weight-bold) !important;
  border-bottom-color: var(--hirakumo-brand) !important;
}
.eval-salary-detail-compare,
.eval-salary-detail-compare__score,
.eval-salary-detail-compare__rank {
  display: block;
  width: 100%;
  min-width: 0;
}
.eval-assign-block {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  padding: 0.9rem 0;
  border-bottom: 1px solid #e5ebe4;
}
.eval-assign-block:first-child {
  padding-top: 0;
}
.eval-assign-block:last-child,
.eval-assign-block--bonus {
  border-bottom: 0;
  padding-bottom: 0;
}
.eval-assign-block--bonus {
  flex-direction: row;
  flex-wrap: wrap;
  gap: 0.65rem 1.25rem;
  padding-top: 1rem;
  margin-top: 0.15rem;
}
.eval-assign-row--top {
  align-items: flex-start;
}
.eval-assign-row--top .eval-assign-role-label {
  padding-top: 0.45rem;
}
.eval-mid-batch-chip-box {
  width: 100%;
  min-height: calc(var(--sch-select-chip-h) + 0.7rem);
  padding: 0.35rem 0.5rem;
  border: 1px solid #e5e7eb;
  border-radius: 0.375rem;
  background: #fff;
  box-sizing: border-box;
}
.eval-assign-row {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  min-width: 0;
}
.eval-assign-role-label {
  flex: 0 0 10.75rem;
  width: 10.75rem;
  margin: 0;
  font-size: var(--type-body);
  font-weight: 600;
  color: #333;
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  gap: 0.15rem;
}
.eval-assign-role-label .badge {
  font-size: 0.75em;
  font-weight: 400;
}
.eval-assign-row-body {
  min-width: 0;
  flex: 1 1 auto;
}
.eval-assign-dates {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.4rem 0.5rem;
}
.eval-assign-date-sep {
  flex: 0 0 auto;
  color: #6b7280;
  font-size: 0.875rem;
  line-height: 1;
}
@media (max-width: 575.98px) {
  .eval-assign-row {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.4rem;
  }
  .eval-assign-role-label {
    flex-basis: auto;
    width: auto;
  }
}
@media (max-width: 991.98px) {
  .eval-period-meta-field {
    width: auto;
    max-width: 100%;
  }
  .eval-period-name-wrap,
  .eval-period-name-input,
  .eval-period-form-label-input,
  .eval-period-date-input,
  .eval-period-range {
    flex: 1 1 auto;
    width: auto !important;
    min-width: 0;
  }
  .eval-period-range {
    width: 100%;
  }
  .eval-period-range .eval-period-date-input {
    flex: 1 1 8rem;
  }
  .eval-assign-dates .eval-period-date-input {
    flex: 0 0 auto;
    width: 9.5rem !important;
    max-width: 9.5rem;
  }
}
@media (max-width: 575.98px) {
  .eval-period-meta-field {
    width: 100%;
    grid-template-columns: 5.5rem minmax(0, 1fr);
  }
  .eval-period-meta-actions {
    width: 100%;
  }
}
.eval-form-builder-legend--preview {
  margin-left: auto;
  justify-content: flex-end;
}
.eval-form-builder-categories {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  margin-bottom: 1rem;
}
.eval-category-card {
  border: 1px solid #d4ddd2;
  border-radius: 0;
  background: #fff;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.eval-category-card-head,
.eval-form-split__body--preview .eval-cat-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  box-sizing: border-box;
  height: 3rem;
  min-height: 3rem;
  padding: 0 0.85rem;
  background: #eef3ec;
  color: #3d5340;
  border-bottom: 1px solid #d4ddd2;
  font-weight: 700;
  font-size: 0.875rem;
  line-height: 1.2;
}
.eval-cat-name-row {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  min-width: 0;
  width: 100%;
}
.eval-cat-title {
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 1.2;
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.eval-cat-icon-btn {
  flex-shrink: 0;
  width: 1.45rem;
  height: 1.45rem;
  border: 0;
  border-radius: 0.35rem;
  background: transparent;
  color: #5f715c;
  font-size: 0.9rem;
  line-height: 1;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.eval-cat-icon-btn:hover {
  background: rgba(255, 255, 255, 0.65);
  color: #2f6b28;
}
.eval-cat-icon-btn--danger {
  color: #9ca3af;
  font-size: 1.15rem;
  font-weight: 600;
}
.eval-cat-icon-btn--danger:hover {
  background: #FDECEC;
  color: #B81C22;
}
.eval-cat-inline-edit {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  width: 100%;
  min-width: 0;
}
.eval-cat-inline-edit .form-control {
  flex: 1 1 auto;
  min-width: 0;
}
.eval-cat-inline-edit .btn {
  flex-shrink: 0;
}
.eval-category-card-body {
  padding: 1.25rem 1rem 1rem;
}
.eval-form-builder-actions {
  padding-top: 0.25rem;
  margin-bottom: 0.5rem;
}
.eval-form-split-page {
  --eval-green: #4CBBB4;
  --eval-line: #e2ebe0;
  --eval-muted: #5f715c;
}
.eval-form-fullscreen {
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  inset: 0 !important;
  z-index: 2200 !important;
  background: #f7faf6;
  display: flex;
  flex-direction: column;
  height: 100vh !important;
  height: 100dvh !important;
  width: 100vw !important;
  max-width: none !important;
  margin: 0 !important;
  overflow: hidden;
}
body:has(.eval-form-fullscreen) {
  overflow: hidden;
}
.eval-form-fullscreen__panel {
  width: 100%;
  height: 100%;
  margin: 0;
  background: #f7faf6;
  display: flex;
  flex-direction: column;
  min-height: 0;
  overflow: hidden;
}
.eval-form-fullscreen .card.dash-card {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  min-height: 0;
  height: 100%;
  margin: 0;
  border-radius: 0;
  overflow: hidden;
}
.eval-form-fullscreen .card-header,
.eval-form-fullscreen .eval-form-fullscreen__toolbar {
  flex-shrink: 0;
}
.eval-form-fullscreen .card-body {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.eval-form-fullscreen--builder .card-body {
  overflow: hidden;
}
.eval-form-fullscreen.eval-form-fullscreen--fill {
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
.eval-form-fullscreen--fill .eval-form-fullscreen__panel {
  overflow: visible;
  height: auto;
  min-height: 100%;
  flex: none;
}
.eval-form-fullscreen--fill .card.dash-card {
  overflow: visible;
  height: auto;
  min-height: 100%;
  flex: none;
  display: block;
}
.eval-form-fullscreen--fill .card-header {
  position: static;
  flex-shrink: unset;
  background: #fff;
}
.eval-form-fullscreen--fill .card-body,
.eval-form-fullscreen--fill .px-3.pb-4 {
  display: block;
  overflow: visible;
  flex: none;
  min-height: 0;
  height: auto;
}
.eval-form-fullscreen--fill .eval-cat-section {
  overflow: visible;
}
.eval-form-fullscreen--fill .eval-field-control,
.eval-form-fullscreen--fill .eval-sheet-item-row,
.eval-form-fullscreen--fill .eval-task-card-fields {
  overflow: visible;
}
.eval-form-fullscreen--builder .eval-period-meta-row {
  flex-shrink: 0;
}
.eval-form-fullscreen--builder .eval-form-split-page {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.eval-form-fullscreen--builder .eval-form-split {
  height: 100%;
  max-height: none;
  min-height: 0;
  flex: 1 1 auto;
}
.eval-form-split {
  display: grid;
  grid-template-columns: minmax(540px, var(--eval-edit-width, 540px)) 6px minmax(340px, 1fr);
  gap: 0;
  align-items: stretch;
  min-height: 55vh;
  height: min(70vh, calc(100vh - 16rem));
  max-height: calc(100vh - 14rem);
}
.eval-form-split-page.is-preview-only .eval-form-split {
  grid-template-columns: minmax(0, 1fr);
}
.eval-form-split-page.is-preview-only .eval-form-split__side,
.eval-form-split-page.is-preview-only .eval-form-resizer {
  display: none !important;
}
.eval-form-split-page.is-preview-only .eval-form-split__main {
  min-width: 0 !important;
}
.eval-form-split-page.is-preview-only .eval-preview-remove-btn {
  display: none !important;
}
fieldset.eval-form-editor-lock {
  border: 0;
  margin: 0;
  min-width: 0;
  min-height: 0;
  width: 100%;
}
fieldset.eval-form-editor-lock:disabled {
  opacity: 1;
}
.eval-form-split-page.is-readonly .eval-column-editor-input,
.eval-form-split-page.is-readonly .eval-column-editor-select,
.eval-form-split-page.is-readonly .eval-role-choice input {
  pointer-events: none;
}
.eval-preview-expand-btn {
  flex-shrink: 0;
}
.eval-form-split__head--preview > .eval-preview-expand-btn {
  margin-left: auto;
}
.eval-form-split__head--preview:has(.eval-preview-form-name) > .eval-preview-expand-btn {
  margin-left: 0.5rem;
}
.eval-form-split-page.is-resizing,
.eval-form-split-page.is-resizing * {
  cursor: col-resize !important;
  user-select: none;
}
.eval-form-split__side,
.eval-form-split__main {
  min-width: 0;
  min-height: 0;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-self: stretch;
  overflow: hidden;
}
@media (min-width: 901px) {
  .eval-form-split__side {
    min-width: 540px;
  }
  .eval-form-split__main {
    min-width: 340px;
  }
  .bonus-form-split-page .eval-form-split__side {
    min-width: 280px;
  }
  .bonus-form-split-page .eval-form-split__main {
    min-width: 280px;
  }
}
.bonus-form-split-page .eval-form-split {
  grid-template-columns: minmax(280px, var(--eval-edit-width, 300px)) 6px minmax(280px, 1fr);
}
.eval-form-split__card {
  background: #fff;
  border: 1px solid var(--eval-line);
  border-radius: 0.85rem;
  overflow: hidden;
  flex: 1 1 auto;
  min-height: 0;
  height: 100%;
  display: flex;
  flex-direction: column;
}
.eval-form-split__card--preview {
  background: #fff;
}
.eval-form-split__head {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  box-sizing: border-box;
  height: 4rem;
  min-height: 4rem;
  padding: 0.5rem 1rem;
  border-bottom: 1px solid #e8efe6;
  font-weight: 600;
  font-size: 0.75rem;
  color: #5f715c;
  background: #fff;
}
.eval-form-split__head--preview {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  flex-wrap: nowrap;
}
.eval-form-split__head-hint {
  margin-left: auto;
  font-size: 0.6875rem;
  font-weight: 500;
  color: #8a9a86;
}
.eval-preview-form-name {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  margin-left: auto;
  min-width: 0;
  flex: 1 1 16rem;
  max-width: 28rem;
}
.eval-preview-form-name-label {
  margin: 0;
  font-size: 0.75rem;
  font-weight: 700;
  color: #333;
  white-space: nowrap;
}
.eval-preview-form-name-input {
  flex: 1 1 auto;
  min-width: 0;
  width: auto !important;
}
.bonus-head-add-genre-btn {
  width: 100%;
  margin: 0;
  padding: 0.4rem 0.75rem;
}
.eval-genre-register-wrap {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  flex: 1 1 auto;
  width: 100%;
  min-width: 0;
}
.eval-genre-register {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.4rem;
  width: 100%;
  min-width: 0;
}
.eval-genre-register-input {
  flex: 1 1 auto;
  min-width: 0;
  width: auto !important;
}
.eval-genre-register-btn {
  flex: 0 0 auto;
  white-space: nowrap;
}
.eval-genre-register-error {
  width: 100%;
  flex: 0 0 auto;
  margin-top: 0.25rem;
  font-size: 0.75rem;
  color: #dc3545;
  line-height: 1.35;
}
.eval-form-split__head:has(.eval-genre-register) {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  height: auto;
  min-height: 4rem;
  padding: 0.75rem 1rem;
}
.eval-form-split__body {
  flex: 1 1 auto;
  min-height: 0;
  padding: 1rem;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
.eval-form-split__body--preview {
  background: #fff;
}
.eval-form-split__body--preview .eval-cat-section:last-child {
  margin-bottom: 0;
}
.eval-form-resizer {
  display: flex;
  align-items: stretch;
  justify-content: center;
  cursor: col-resize;
  touch-action: none;
  z-index: 5;
  align-self: stretch;
  min-height: 100%;
  padding: 0 1px;
  margin: 0;
}
.eval-form-resizer-bar {
  width: 3px;
  margin: 0;
  border-radius: 999px;
  background: #d5e0d4;
  align-self: stretch;
  flex: 0 0 auto;
  min-height: 100%;
}
.eval-form-resizer:hover .eval-form-resizer-bar,
.eval-form-split-page.is-resizing .eval-form-resizer-bar {
  width: 3px;
  background: var(--eval-green);
}
.eval-column-builder-editor {
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  background: #fafafa;
  padding: 0.875rem;
}
.eval-column-builder-editor--flush {
  border: none;
  background: transparent;
  padding: 0;
  border-radius: 0;
}
.eval-column-builder-editor-title {
  font-size: 0.75rem;
  font-weight: 700;
  color: #333;
  margin-bottom: 0.75rem;
}
.eval-column-preview-empty {
  font-size: 0.8125rem;
  color: #9ca3af;
  padding: 0.75rem 0.25rem;
}
.eval-column-editor-row {
  display: flex;
  gap: 0.625rem;
  align-items: flex-start;
  padding: 0.75rem;
  margin-bottom: 0.625rem;
  background: #fff;
  border: 2px solid #e5e7eb;
  border-radius: 10px;
  cursor: pointer;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}
.eval-column-editor-row:hover {
  border-color: #c5d4c2;
  background: #fafcfa;
}
.eval-column-editor-row.is-focused {
  border-color: #4CBBB4;
  background: #f3faf1;
  box-shadow: 0 0 0 3px rgba(76, 187, 180, 0.22);
}
.eval-column-editor-row.has-error {
  border-color: #B81C22;
  background: #FDECEC;
  box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.18);
}
.eval-column-editor-row.has-error:hover {
  border-color: #B81C22;
  background: #FDECEC;
}
.eval-column-editor-row.has-error.is-focused {
  border-color: #B81C22;
  background: #FDECEC;
  box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.22);
}
.eval-column-editor-row.has-error .eval-column-editor-num {
  background: #B81C22;
  color: #fff;
}
.eval-column-editor-row.is-focused .eval-column-editor-num {
  background: #4CBBB4;
  color: #fff;
}
.eval-column-editor-row.has-error.is-focused .eval-column-editor-num {
  background: #B81C22;
  color: #fff;
}
.eval-column-editor-error {
  color: #B81C22;
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 1.35;
  margin-top: -0.15rem;
  margin-bottom: 0.35rem;
}
.eval-column-editor-input.is-invalid,
.eval-column-editor-select.is-invalid {
  border-color: #B81C22 !important;
  background-color: #fff5f5;
}
.eval-form-builder-alert {
  font-size: 0.8125rem;
  font-weight: 600;
  padding: 0.5rem 0.75rem;
  border-radius: 8px;
  background: #FDECEC;
  border: 1px solid #fecaca;
}
.eval-column-editor-num {
  flex-shrink: 0;
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 999px;
  background: #f3f4f6;
  color: #6b7280;
  font-size: 0.75rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 0.25rem;
}
.eval-column-editor-fields {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}
.eval-column-editor-field {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.eval-column-editor-field > label {
  flex: 0 0 5.25rem;
  margin-bottom: 0;
  font-size: var(--type-other) !important;
  font-weight: 600;
  color: #333;
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.15rem;
  line-height: 1.35;
}
.eval-column-editor-field .badge {
  font-size: 0.7em;
  font-weight: 400;
}
.eval-column-editor-field--roles {
  align-items: center;
}
.eval-column-editor-field--roles > label {
  margin-top: 0.15rem;
}
.eval-role-tag-group {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-start;
  gap: 0.55rem;
  flex: 1 1 auto;
  width: auto;
  max-width: 100%;
  min-width: max-content;
}
.eval-role-choice {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  margin: 0;
  padding: 0;
  width: auto;
  flex: 0 0 auto;
  height: auto;
  min-height: 0;
  cursor: pointer;
  user-select: none;
  line-height: 1.2;
}
.eval-role-choice:has(input:disabled) {
  cursor: default;
  pointer-events: none;
}
.eval-role-choice input[type="radio"] {
  margin: 0;
  padding: 0;
  flex-shrink: 0;
  accent-color: #4CBBB4;
}
.eval-role-choice .eval-role-badge {
  padding: 0.15rem 0.4rem;
}
.eval-role-choice:has(input:focus-visible) .eval-role-badge {
  outline: 2px solid #4CBBB4;
  outline-offset: 2px;
}
.eval-column-editor-input,
.eval-column-editor-select {
  flex: 1;
  min-width: 0;
  width: auto;
  box-sizing: border-box;
  padding: 0.35rem 0.5rem;
  border: 1.5px solid #d1d5db;
  border-radius: 8px;
  font-size: var(--type-other);
  line-height: 1.35;
  font-family: inherit;
  background: #fff;
}
.eval-column-editor-control--short {
  flex: 1 1 auto !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
}
.eval-column-editor-select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  cursor: pointer;
  padding-right: 1.85rem;
  background-color: #fff;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%236b7280' d='M1.1 1.1a.75.75 0 0 1 1.06 0L6 4.94l3.84-3.84a.75.75 0 1 1 1.06 1.06l-4.37 4.37a.75.75 0 0 1-1.06 0L1.1 2.16a.75.75 0 0 1 0-1.06z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.65rem center;
  background-size: 0.7rem;
  color: #333;
}
.eval-column-editor-select:hover {
  border-color: #9ca3af;
}
.eval-column-editor-input:focus,
.eval-column-editor-select:focus {
  border-color: #4CBBB4;
  outline: none;
  border-radius: 8px;
  box-shadow: 0 0 0 3px rgba(76, 187, 180, 0.15);
}
.eval-column-editor-input:disabled,
.eval-column-editor-select:disabled {
  background-color: #e9ecef !important;
  color: #6c757d !important;
  border-color: #ced4da;
  cursor: default;
  opacity: 1;
  box-shadow: none;
}
.eval-column-editor-select:disabled {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23adb5bd' d='M1.1 1.1a.75.75 0 0 1 1.06 0L6 4.94l3.84-3.84a.75.75 0 1 1 1.06 1.06l-4.37 4.37a.75.75 0 0 1-1.06 0L1.1 2.16a.75.75 0 0 1 0-1.06z'/%3E%3C/svg%3E");
}
.eval-column-remove-btn {
  flex-shrink: 0;
  width: 1.75rem;
  height: 1.75rem;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: #B81C22;
  font-size: 1.125rem;
  line-height: 1;
  cursor: pointer;
  margin-top: 0.25rem;
  padding: 0;
}
.eval-column-remove-btn:hover {
  background: #FDECEC;
  color: #B81C22;
}
.eval-column-add-btn {
  display: block;
  width: 100%;
  margin-top: 0.5rem;
  padding: 0.55rem 0.75rem;
  border: 1.5px dashed #c9d4c8;
  border-radius: 999px;
  background: #fff;
  color: #2f6b28;
  font-size: 0.8125rem;
  font-weight: 600;
  line-height: 1.3;
  text-align: center;
  cursor: pointer;
  transition: background-color 0.12s ease, border-color 0.12s ease, color 0.12s ease;
}
.eval-column-add-btn:hover {
  background: #f3f8f2;
  border-color: #4CBBB4;
  color: #246b1f;
}
@media (max-width: 900px) {
  .eval-form-split {
    grid-template-columns: 1fr;
    height: auto;
    max-height: none;
  }
  .eval-form-split__side,
  .eval-form-split__main {
    height: auto;
    max-height: min(50vh, 28rem);
  }
  .eval-form-resizer {
    display: none !important;
  }
}
.eval-cat-section {
  border: 1px solid #d4ddd2;
  border-radius: 0;
  overflow: hidden;
  margin-bottom: 1rem;
  background: #fff;
}
.eval-detail-panel .eval-cat-section {
  max-width: none;
}
.eval-cat-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  box-sizing: border-box;
  height: 3rem;
  min-height: 3rem;
  padding: 0 0.85rem;
  background: #eef3ec;
  color: #3d5340;
  font-weight: 700;
  font-size: 0.875rem;
  line-height: 1.2;
  border-bottom: 1px solid #d4ddd2;
}
.eval-cat-section-head-label {
  min-width: 0;
  flex: 1 1 auto;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.eval-cat-section-head .eval-preview-remove-btn {
  margin-top: 0;
  flex-shrink: 0;
}
.eval-cat-section-body { padding: 1rem; }
.eval-role-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
  padding: 0.2rem 0.55rem;
  border-radius: 999px;
  font-size: 0.7rem;
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: 0.02em;
  white-space: nowrap;
  box-sizing: border-box;
}
.eval-role-badge--employee { background: var(--hirakumo-role-employee); color: #ffffff; }
.eval-role-badge--manager1 { background: var(--hirakumo-role-manager1); color: #ffffff; }
.eval-role-badge--manager2 { background: var(--hirakumo-role-manager2); color: #ffffff; }
.eval-role-badge--manager3 { background: var(--hirakumo-role-manager3); color: #333333; }
.role-tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
  padding: 0.2rem 0.55rem;
  border-radius: 999px;
  font-size: 0.7rem;
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: 0.02em;
  white-space: nowrap;
  box-sizing: border-box;
  flex-shrink: 0;
}
.role-tag--0 { background: var(--hirakumo-role-employee); color: #ffffff; }
.role-tag--1 { background: var(--hirakumo-role-manager1); color: #ffffff; }
.role-tag--2 { background: var(--hirakumo-role-manager2); color: #ffffff; }
.role-tag--3 { background: var(--hirakumo-role-manager3); color: #333333; }
.role-tag--4 { background: var(--hirakumo-brand-hover); color: #ffffff; }
.role-tag--5 { background: var(--hirakumo-info); color: var(--hirakumo-ink); }
.role-tag--6 { background: var(--hirakumo-emphasis-hover); color: #ffffff; }
.role-tag--7 { background: var(--hirakumo-border); color: var(--hirakumo-ink); }
.role-tag--8 { background: var(--hirakumo-accent2); color: #ffffff; }
.role-tag--9 { background: var(--hirakumo-danger); color: #ffffff; }
.profile-form-control {
  max-width: 20rem;
}
.password-input-wrap:has(.profile-form-control),
.password-input-wrap.profile-form-control {
  max-width: 20rem;
}
.profile-password-divider {
  margin: 1.35rem 0 1.25rem;
  border: 0;
  border-top: 1px solid #e5e7eb;
  opacity: 1;
}
.profile-photo-dropzone {
  display: block;
  width: fit-content;
  max-width: 100%;
  cursor: pointer;
  background: #f8faf9;
  border: 1px dashed #d1d5db;
  border-radius: 0.75rem;
  padding: 1rem 1.25rem;
}
.profile-photo-dropzone:hover {
  background: #f3f8f2;
  border-color: #9ca3af;
}
.profile-photo-preview {
  width: 72px;
  height: 72px;
  border-radius: 999px;
  object-fit: cover;
  display: block;
  margin: 0 auto 0.5rem;
  background: #e5e7eb;
}
.profile-photo-fallback {
  width: 72px;
  height: 72px;
  border-radius: 999px;
  background: #6b7280;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.4rem;
  font-weight: 700;
  margin: 0 auto 0.5rem;
}
.emp-photo-preview {
  width: 48px;
  height: 48px;
  border-radius: 999px;
  object-fit: cover;
  background: #e5e7eb;
}
.eval-sheet-hint {
  font-size: 0.8125rem;
  color: #6b7280;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
}
.eval-field-row {
  display: grid;
  grid-template-columns: minmax(10rem, 14rem) 1fr;
  gap: 0.75rem 1rem;
  padding: 0.85rem 1rem;
  margin-bottom: 0.65rem;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  border-left-width: 4px;
}
.eval-field-row--employee { border-left-color: var(--hirakumo-role-employee); background: var(--hirakumo-focus-fill); }
.eval-field-row--manager1 { border-left-color: var(--hirakumo-role-manager1); background: #F5F5F5; }
.eval-field-row--manager2 { border-left-color: var(--hirakumo-role-manager2); background: var(--hirakumo-focus-fill); }
.eval-field-row--manager3 { border-left-color: var(--hirakumo-role-manager3); background: var(--hirakumo-outline-emphasis-hover); }
.eval-field-row--editable { box-shadow: 0 0 0 1px rgba(76, 187, 180, 0.2); }
.eval-field-row--readonly { opacity: 0.92; }
.eval-field-meta {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}
.eval-field-label {
  font-size: 0.8125rem;
  font-weight: 600;
  color: #333;
  margin: 0;
}
.eval-field-control .form-control:disabled {
  background: #f3f4f6;
  color: #6b7280;
}
.eval-field-row--preview-line {
  display: contents;
}
.eval-form-split__body--preview .eval-field-row--preview-line {
  display: grid;
  grid-template-columns: 4.75rem var(--eval-label-col, max-content) minmax(3.5rem, 1fr) 1.75rem;
  column-gap: 0.5rem;
  align-items: center;
  justify-content: stretch;
  width: 100%;
  padding: 0.18rem 0.5rem;
  margin: 0;
  border: 2px solid transparent;
  border-radius: 10px;
  background: transparent;
  cursor: grab;
  position: relative;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease, opacity 0.15s ease;
}
.eval-form-split__body--preview .eval-field-row--preview-line:hover {
  border-color: #c5d4c2;
  background: #fafcfa;
}
.eval-form-split__body--preview .eval-field-row--preview-line.is-active {
  border-color: #4CBBB4;
  background: #f3faf1;
  box-shadow: 0 0 0 3px rgba(76, 187, 180, 0.22);
}
.eval-form-split__body--preview .eval-field-row--preview-line.has-error {
  border-color: #B81C22;
  background: #FDECEC;
  box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.18);
}
.eval-form-split__body--preview .eval-field-row--preview-line.has-error:hover,
.eval-form-split__body--preview .eval-field-row--preview-line.has-error.is-active,
.eval-form-split__body--preview .eval-field-row--preview-line.has-error:focus-visible {
  border-color: #B81C22;
  background: #FDECEC;
  box-shadow: 0 0 0 3px rgba(220, 38, 38, 0.22);
}
.eval-form-split__body--preview .eval-field-row--preview-line:focus {
  outline: none;
}
.eval-form-split__body--preview .eval-field-row--preview-line:focus-visible {
  border-color: #4CBBB4;
  box-shadow: 0 0 0 3px rgba(76, 187, 180, 0.28);
}
.eval-form-split__body--preview .eval-field-row--preview-line.is-dragging {
  opacity: 0.45;
  cursor: grabbing;
}
.eval-form-split__body--preview .eval-field-row--preview-line.drop-before::before,
.eval-form-split__body--preview .eval-field-row--preview-line.drop-after::after {
  content: '';
  position: absolute;
  left: 0.4rem;
  right: 0.4rem;
  height: 3px;
  border-radius: 999px;
  background: #4CBBB4;
  box-shadow: 0 0 0 2px rgba(76, 187, 180, 0.2);
  pointer-events: none;
  z-index: 2;
}
.eval-form-split__body--preview .eval-field-row--preview-line.drop-before::before {
  top: -0.2rem;
}
.eval-form-split__body--preview .eval-field-row--preview-line.drop-after::after {
  bottom: -0.2rem;
}
.eval-form-split__body--preview .eval-field-row--preview-line .eval-field-control,
.eval-form-split__body--preview .eval-field-row--preview-line .eval-field-control .form-control,
.eval-form-split__body--preview .eval-field-row--preview-line .eval-field-preview-max {
  pointer-events: none;
}
.eval-form-split__body--preview .eval-preview-remove-btn {
  justify-self: end;
  margin-top: 0.2rem;
  cursor: pointer;
  pointer-events: auto;
  position: relative;
  z-index: 2;
  flex-shrink: 0;
}
.eval-form-split__body--preview .eval-cat-section-body {
  display: flex;
  flex-direction: column;
  gap: 0.12rem;
  align-items: stretch;
}
.eval-cat-section-body--sheet {
  display: flex;
  flex-direction: column;
  gap: 0;
  max-width: none;
}
.eval-cat-section-body--sheet .eval-task-card-fields,
.eval-cat-section-body--sheet .eval-task-card-fields--no-role {
  display: flex;
  flex-direction: column;
  gap: 0;
}
.eval-sheet-item-row {
  display: grid;
  grid-template-columns: 4.75rem var(--eval-label-col, max-content) minmax(0, 1fr);
  column-gap: 0.75rem;
  align-items: center;
  width: 100%;
  padding: 0.7rem 0;
  margin: 0;
  border-bottom: 1px solid #cfd6ce;
  box-sizing: border-box;
}
.eval-task-card-fields--no-role .eval-sheet-item-row {
  grid-template-columns: var(--eval-label-col, max-content) minmax(0, 1fr);
}
.eval-sheet-item-row .eval-field-preview-item {
  min-width: 0;
  margin-top: 0;
  font-size: 0.875rem;
  font-weight: 400;
  color: #333;
  white-space: nowrap;
  overflow: visible;
  overflow-wrap: normal;
  word-break: keep-all;
  line-height: 1.4;
}
.eval-sheet-item-row .eval-role-badge {
  margin-top: 0;
  align-self: center;
}
.eval-sheet-item-row .eval-field-control {
  min-width: 0;
  width: 100%;
  display: flex;
  align-items: center;
  gap: 0.35rem;
}
.eval-sheet-item-row .eval-field-value-label {
  min-width: 0;
  max-width: none;
  font-size: 0.9375rem;
  font-weight: 500;
  color: #333;
  line-height: 1.55;
  white-space: pre-wrap;
  word-break: break-word;
  padding: 0.15rem 0;
}
.eval-sheet-item-row .eval-field-value-label--score,
.eval-sheet-item-row .eval-field-value-label--score .eval-field-preview-max,
.eval-form-fullscreen--fill .eval-field-value-label--score,
.eval-form-fullscreen--fill .eval-field-preview-max,
.eval-task-card-fields .eval-field-value-label--score,
.eval-task-card-fields .eval-field-value-label--score .eval-field-preview-max {
  font-size: 0.9375rem !important;
  font-weight: 400 !important;
  line-height: 1.55;
  color: #333;
  white-space: nowrap;
}
.eval-task-card {
  display: flex;
  gap: 0.625rem;
  align-items: flex-start;
  padding: 1rem 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  border-top: 1px solid #e5e7eb;
}
.eval-task-card:first-child {
  border-top: 0;
  padding-top: 0;
}
.eval-task-card-num {
  flex-shrink: 0;
  width: 1.5rem;
  height: 1.5rem;
  border-radius: 999px;
  background: #f3f4f6;
  color: #6b7280;
  font-size: 0.75rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 0.25rem;
}
.eval-task-card-fields {
  flex: 1;
  min-width: 0;
  display: grid;
  grid-template-columns: 4.75rem var(--eval-label-col, max-content) minmax(0, 43rem);
  column-gap: 0.75rem;
  row-gap: 0.65rem;
  align-items: start;
  justify-content: start;
}
/* 従業員入力画面：役割タグ列なし（項目名 | 入力） */
.eval-task-card-fields--no-role {
  grid-template-columns: var(--eval-label-col, max-content) minmax(0, 43rem);
}
.eval-cat-section-body--sheet .eval-task-card-fields,
.eval-cat-section-body--sheet .eval-task-card-fields--no-role,
.eval-form-fullscreen--fill .eval-task-card-fields,
.eval-form-fullscreen--fill .eval-task-card-fields--no-role {
  display: flex;
  flex-direction: column;
  gap: 0;
  width: 100%;
}
.eval-form-fullscreen--fill .eval-sheet-item-row {
  width: 100%;
  border-bottom: 1px solid #cfd6ce;
  padding: 0.32rem 0;
  align-items: center;
}
.eval-form-fullscreen--fill .eval-sheet-item-row:last-child {
  border-bottom: 0;
}
.eval-form-fullscreen--fill .eval-sheet-item-row:has(.form-control),
.eval-form-fullscreen--fill .eval-sheet-item-row:has(textarea) {
  border-bottom: 0;
  padding: 0.32rem 0;
  align-items: center;
}
.eval-form-fullscreen--fill .eval-sheet-item-row .eval-field-value-label,
.eval-form-fullscreen--fill .eval-task-card-fields .eval-field-value-label {
  line-height: 1.35;
  padding: 0.05rem 0;
}
.eval-form-fullscreen--fill .eval-sheet-item-row .eval-field-value-label--score,
.eval-form-fullscreen--fill .eval-field-value-label--score .eval-field-preview-max,
.eval-form-fullscreen--fill .eval-task-card-fields .eval-field-value-label--score,
.eval-form-fullscreen--fill .eval-task-card-fields .eval-field-value-label--score .eval-field-preview-max {
  line-height: 1.35;
}
.eval-form-fullscreen--fill .eval-sheet-item-row .eval-field-preview-item,
.eval-form-fullscreen--fill .eval-sheet-item-row .eval-role-badge {
  margin-top: 0;
  align-self: center;
  line-height: 1.3;
}
.eval-form-fullscreen--fill .eval-task-card-fields .eval-field-control textarea.grow-textarea,
.eval-form-fullscreen--fill .eval-task-card-fields .eval-field-control input[type="number"],
.eval-form-fullscreen--fill .eval-task-card-fields .eval-field-control input[inputmode="numeric"] {
  min-height: 2rem;
  height: 2rem;
  padding-top: 0.22rem;
  padding-bottom: 0.22rem;
  line-height: 1.3;
  font-size: 0.875rem;
  box-sizing: border-box;
  field-sizing: auto;
  align-content: center;
}
.eval-form-fullscreen--fill .eval-cat-section-body--sheet .eval-task-card {
  padding: 0.1rem 0 0.45rem;
  gap: 0.55rem;
}
.eval-form-fullscreen--fill .eval-cat-section-body--sheet .eval-task-card + .eval-task-card {
  margin-top: 0.2rem;
  padding-top: 0.55rem;
  border-top: 1px solid #d1d5db;
}
.eval-form-fullscreen--fill .eval-cat-section-body--sheet .eval-task-card-num {
  margin-top: 0.2rem;
  width: 1.85rem;
  min-width: 1.85rem;
  height: 1.85rem;
  font-size: 0.8125rem;
}
.eval-form-fullscreen--fill .eval-task-add-btn {
  align-self: flex-start;
  width: auto;
  margin-top: 0.5rem;
}
.eval-cat-section-body--sheet .eval-sheet-item-row:last-child {
  border-bottom: 0;
}
.eval-cat-section-body--sheet .eval-task-card {
  border-top: 0;
  padding: 0.15rem 0 0.85rem;
  gap: 0.85rem;
}
.eval-cat-section-body--sheet .eval-task-card + .eval-task-card {
  margin-top: 0.35rem;
  padding-top: 1rem;
  border-top: 1px solid #d1d5db;
}
.eval-cat-section-body--sheet .eval-task-card-num {
  background: #e8eee6;
  color: #333;
  font-size: 0.875rem;
  width: 2.25rem;
  min-width: 2.25rem;
  height: 2.25rem;
  margin-top: 0.55rem;
}
.eval-cat-section-body--sheet .eval-column-add-btn {
  width: auto;
  align-self: stretch;
  margin-top: 0;
}
.eval-form-split__body--preview .eval-field-preview-empty {
  width: 100%;
}
.eval-form-split__body--preview .eval-role-badge {
  justify-self: start;
  margin-top: 0.45rem;
}
.eval-task-card-fields .eval-role-badge {
  justify-self: start;
  margin-top: 0;
}
.eval-form-split__body--preview .eval-field-row--preview-line > .eval-role-badge {
  margin-top: 0;
}
.eval-form-split__body--preview .eval-field-row--preview-line > .eval-field-preview-item {
  margin-top: 0;
}
.eval-form-split__body--preview .eval-field-preview-item {
  min-width: 0;
  max-width: none;
  margin-top: 0.5rem;
  font-size: 0.875rem;
  font-weight: 600;
  color: #333;
  white-space: nowrap;
  overflow: visible;
  overflow-wrap: normal;
  word-break: keep-all;
  line-height: 1.4;
}
.eval-task-card-fields .eval-field-preview-item {
  min-width: 0;
  max-width: none;
  margin-top: 0;
  font-size: 0.875rem;
  font-weight: 600;
  color: #333;
  white-space: nowrap;
  overflow: visible;
  overflow-wrap: normal;
  word-break: keep-all;
  line-height: 1.4;
}
.eval-form-split__body--preview .eval-field-preview-item {
  margin-top: 0;
  line-height: 1.35;
  width: var(--eval-label-col, auto);
  min-width: var(--eval-label-col, max-content);
  flex-shrink: 0;
}
.eval-form-split__body--preview .eval-field-control,
.eval-task-card-fields .eval-field-control {
  min-width: 0;
  width: 100%;
  max-width: none;
  display: flex;
  align-items: center;
  gap: 0.35rem;
  overflow: visible;
}
.eval-form-split__body--preview .eval-field-control .form-control,
.eval-task-card-fields .eval-field-control .form-control {
  flex: 1 1 auto;
  width: 100%;
  min-width: 0;
  max-width: none;
}
.eval-form-split__body--preview .eval-field-control .form-control {
  min-height: 2rem;
  height: 2rem;
  padding-top: 0.22rem;
  padding-bottom: 0.22rem;
  font-size: 0.875rem;
  line-height: 1.3;
}
.eval-form-split__body--preview .eval-field-control input[type="number"],
.eval-form-split__body--preview .eval-field-control input[inputmode="numeric"] {
  flex: 1 1 auto;
  width: auto;
  min-width: 3.25rem;
  max-width: 6.5rem;
}
.eval-task-card-fields .eval-field-control input[type="number"],
.eval-task-card-fields .eval-field-control input[inputmode="numeric"] {
  flex: 0 0 auto;
  width: auto;
  min-width: 3.25rem;
  max-width: 6.5rem;
  min-height: 2.5rem;
  height: 2.5rem;
  padding-top: 0.55rem;
  padding-bottom: 0.55rem;
  line-height: 1.45;
  font-size: 0.9375rem;
  box-sizing: border-box;
}
.eval-form-split__body--preview .eval-field-control textarea.grow-textarea {
  min-height: 2rem;
  height: 2rem;
  padding-top: 0.22rem;
  padding-bottom: 0.22rem;
}
.eval-task-card-fields .eval-field-control textarea.grow-textarea {
  min-height: 2.5rem;
  max-width: none;
  line-height: 1.45;
  padding-top: 0.55rem;
  padding-bottom: 0.55rem;
  field-sizing: content;
  box-sizing: border-box;
  overflow-y: hidden;
  align-content: center;
}
.eval-form-split__body--preview .eval-field-preview-max,
.eval-task-card-fields .eval-field-preview-max {
  flex: 0 0 auto;
  align-self: center;
  margin-top: 0;
  margin-right: 0.15rem;
  font-size: 0.875rem;
  font-weight: 400;
  line-height: 1.45;
  font-family: inherit;
  white-space: nowrap;
  color: var(--bs-body-color, #212529);
}
.eval-task-card-fields .eval-field-value-label {
  flex: 1 1 auto;
  min-width: 0;
  max-width: 43rem;
  font-size: 0.9375rem;
  font-weight: 500;
  color: #333;
  line-height: 1.35;
  white-space: pre-wrap;
  word-break: break-word;
  padding: 0.05rem 0;
}
.eval-task-card-fields .eval-field-preview-item--goal {
  color: #2f6b28;
  font-weight: 700;
}
.eval-task-card-fields .eval-field-value-label--goal {
  color: #2f6b28;
  font-weight: 600;
}
.eval-task-card-fields .eval-field-value-label--score {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: baseline;
  gap: 0.35rem;
  white-space: nowrap;
  word-break: normal;
}
.eval-task-card-fields .eval-field-value-label--score .eval-field-preview-max {
  margin: 0;
  align-self: baseline;
}
@media (max-width: 767.98px) {
  .eval-field-row {
    grid-template-columns: 1fr;
  }
  .eval-cat-section-body--sheet {
    max-width: none;
  }
  .eval-form-split__body--preview .eval-cat-section-body,
  .eval-task-card-fields {
    grid-template-columns: 4.75rem minmax(0, 1fr);
  }
  .eval-form-split__body--preview .eval-field-row--preview-line {
    grid-template-columns: 4.75rem minmax(0, 1fr) 1.75rem;
  }
  .eval-task-card-fields--no-role {
    grid-template-columns: minmax(0, 1fr);
  }
  .eval-form-split__body--preview .eval-field-preview-item,
  .eval-task-card-fields .eval-field-preview-item {
    grid-column: 2;
    max-width: none;
  }
  .eval-form-split__body--preview .eval-field-row--preview-line > .eval-field-preview-item {
    grid-column: 2;
  }
  .eval-task-card-fields--no-role .eval-field-preview-item {
    grid-column: 1;
  }
  .eval-form-split__body--preview .eval-field-control,
  .eval-task-card-fields .eval-field-control {
    grid-column: 1 / -1;
    max-width: none;
  }
  .eval-form-split__body--preview .eval-field-row--preview-line > .eval-field-control {
    grid-column: 1 / 3;
  }
  .eval-form-split__body--preview .eval-field-row--preview-line > .eval-preview-remove-btn {
    grid-column: 3;
    grid-row: 1;
  }
  .eval-form-split__body--preview .eval-field-control .form-control,
  .eval-task-card-fields .eval-field-control .form-control,
  .eval-form-split__body--preview .eval-field-control textarea.grow-textarea,
  .eval-task-card-fields .eval-field-control textarea.grow-textarea {
    max-width: none;
  }
  .eval-form-split__body--preview .eval-field-control input[type="number"],
  .eval-task-card-fields .eval-field-control input[type="number"],
  .eval-form-split__body--preview .eval-field-control input[inputmode="numeric"],
  .eval-task-card-fields .eval-field-control input[inputmode="numeric"] {
    width: 6.5rem;
    max-width: 6.5rem;
  }
  .eval-cat-section-body--sheet .eval-task-card-fields,
  .eval-cat-section-body--sheet .eval-task-card-fields--no-role {
    display: flex;
    flex-direction: column;
  }
  .eval-sheet-item-row,
  .eval-task-card-fields--no-role .eval-sheet-item-row {
    grid-template-columns: minmax(0, 1fr);
  }
  .eval-cat-section-body--sheet .eval-task-card-fields .eval-field-preview-item,
  .eval-cat-section-body--sheet .eval-task-card-fields--no-role .eval-field-preview-item,
  .eval-cat-section-body--sheet .eval-task-card-fields .eval-field-control {
    grid-column: auto;
    max-width: none;
  }
}
@media (max-width: 991.98px) {
  .eval-task-card-fields .eval-field-preview-item,
  .eval-sheet-item-row .eval-field-preview-item {
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: normal;
  }
}

/* 賞与スコア表 */
.bonus-form-section {
  border: 1px solid #e5e7eb;
  border-radius: 0;
  overflow: hidden;
  background: #fff;
}
.bonus-table-scroll-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.bonus-score-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.8125rem;
  min-width: 640px;
}
.bonus-score-table th,
.bonus-score-table td {
  border: 1px solid #e5e7eb;
  padding: 0.08rem 0.35rem;
  vertical-align: middle;
  line-height: 1.2;
}
/* Beat Bootstrap `.table > :not(caption) > * > *` cell padding */
.table.bonus-score-table > :not(caption) > * > * {
  padding: 0.08rem 0.35rem;
  line-height: 1.2;
  vertical-align: middle;
}
.bonus-score-table thead th,
.table.bonus-score-table > :not(caption) > thead > * > * {
  background: #f3f4f6;
  font-weight: 700;
  color: #333;
  text-align: center;
  white-space: nowrap;
  padding: 0.5rem 0.4rem;
  line-height: 1.45;
}
/* Match 給与 preview category head (組織貢献 / .eval-cat-section-head) */
.page-content .table.bonus-score-table--interactive thead th,
.bonus-form-preview-body .table.bonus-score-table--interactive thead th {
  background: #eef3ec !important;
  color: #3d5340 !important;
  border-color: #e5e7eb !important;
  box-shadow: none;
  padding: 0.55rem 0.5rem !important;
  font-size: 0.875rem !important;
  font-weight: 700 !important;
  line-height: 1.5 !important;
  white-space: nowrap;
}
/* Builder preview: content-sized columns */
.page-content .table.bonus-score-table--interactive,
.bonus-form-preview-body .table.bonus-score-table--interactive {
  width: max-content;
  max-width: 100%;
  min-width: 0;
  table-layout: auto;
}
.page-content .table.bonus-score-table--interactive > :not(caption) > tbody > * > *,
.bonus-form-preview-body .table.bonus-score-table--interactive > :not(caption) > tbody > * > * {
  border: 1px solid #e5e7eb !important;
  box-shadow: none !important;
  padding: 0.28rem 0.4rem !important;
  line-height: 1.3 !important;
}
.page-content .table.bonus-score-table--interactive > :not(caption) > thead > * > *,
.bonus-form-preview-body .table.bonus-score-table--interactive > :not(caption) > thead > * > * {
  border: 1px solid #e5e7eb !important;
  box-shadow: none !important;
}
.page-content .table.bonus-score-table--interactive .bonus-preview-cell.is-selected,
.bonus-form-preview-body .table.bonus-score-table--interactive .bonus-preview-cell.is-selected {
  box-shadow: none !important;
  outline: none;
  position: relative;
  z-index: 4;
  overflow: visible;
}
.page-content .table.bonus-score-table--interactive .bonus-preview-cell.is-selected::after,
.bonus-form-preview-body .table.bonus-score-table--interactive .bonus-preview-cell.is-selected::after {
  content: "";
  position: absolute;
  inset: 0;
  border: 2px solid #4CBBB4;
  box-sizing: border-box;
  pointer-events: none;
  z-index: 4;
}
.bonus-score-table--interactive .bonus-col-genre,
.bonus-score-table--interactive .bonus-col-major,
.bonus-score-table--interactive .bonus-col-minor,
.bonus-score-table--interactive .bonus-cell-genre,
.bonus-score-table--interactive .bonus-cell-major,
.bonus-score-table--interactive .bonus-cell-minor {
  width: auto;
  min-width: 5.75rem;
  white-space: nowrap;
}
/* Floor = コミュニケーション + delete icon + padding */
.bonus-score-table--interactive .bonus-col-item,
.bonus-score-table--interactive .bonus-cell-item {
  width: auto;
  min-width: 10.75rem;
  white-space: nowrap;
}
.bonus-col-genre,
.bonus-col-major,
.bonus-col-minor {
  width: auto;
}
.bonus-col-item { width: auto; }
.bonus-col-max,
.bonus-col-boss,
.bonus-col-final {
  width: 4.5rem;
  text-align: center;
  white-space: nowrap;
}
.bonus-col-remark {
  min-width: 14rem;
  width: auto;
  text-align: center;
}
.bonus-cell-remark {
  text-align: left;
  font-size: 0.8125rem;
  font-weight: 500;
  color: #4b5563;
  white-space: normal;
  min-width: 14rem;
  max-width: 28rem;
  line-height: 1.2;
  vertical-align: middle;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.bonus-remark-text {
  display: block;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
  line-height: 1.2;
  color: #333;
  text-align: left;
}
.bonus-remark-text.is-empty {
  color: #9ca3af;
  text-align: center;
}
.bonus-score-table .form-control,
.bonus-score-table .form-control-sm {
  min-height: 1.45rem;
  height: 1.45rem;
  padding: 0.04rem 0.25rem;
  font-size: 0.8125rem;
  line-height: 1.2;
  box-sizing: border-box;
}
.bonus-cell-remark .bonus-remark-input,
.bonus-cell-remark textarea.form-control,
.bonus-cell-remark textarea.form-control-sm,
.bonus-cell-remark textarea.bonus-remark-input.grow-textarea {
  width: 100%;
  min-height: 1.45rem;
  height: 1.45rem;
  /* Fill the box so the caret sits in the middle, like the score <input>. */
  padding: 0 0.35rem;
  font-size: 0.8125rem;
  line-height: calc(1.45rem - 2px);
  text-align: left;
  align-content: center;
  vertical-align: middle;
  field-sizing: fixed;
  overflow-y: hidden;
  resize: none;
  box-sizing: border-box;
  background: #fff;
}
.bonus-cell-remark textarea.bonus-remark-input.grow-textarea:focus,
.bonus-cell-remark textarea.bonus-remark-input.grow-textarea:focus-visible {
  min-height: 1.45rem;
  height: 1.45rem;
  padding: 0 0.35rem;
  line-height: calc(1.45rem - 2px);
  background: #fff;
}
.bonus-cell-group {
  text-align: center !important;
  font-weight: 600;
  color: #333;
}
.bonus-score-table--interactive td.bonus-cell-genre,
.bonus-score-table--interactive td.bonus-cell-major,
.bonus-score-table--interactive td.bonus-cell-minor {
  text-align: center !important;
}
/* Soft tag-tinted cells (lighter than editor badges) */
.bonus-score-table td.bonus-cell-genre,
.page-content .table.bonus-score-table td.bonus-cell-genre {
  background: #f5f8ff !important;
  color: #3b6fd4 !important;
}
.bonus-score-table td.bonus-cell-major,
.page-content .table.bonus-score-table td.bonus-cell-major {
  background: #f3faf6 !important;
  color: #2f7a5b !important;
}
.bonus-score-table td.bonus-cell-minor,
.page-content .table.bonus-score-table td.bonus-cell-minor {
  background: #f3f9fd !important;
  color: #3b7ea3 !important;
}
.bonus-cell-item { text-align: left; font-weight: 500; }
.bonus-cell-max,
.bonus-cell-boss,
.bonus-cell-final,
.eval-cell-score {
  text-align: center;
}
.bonus-score-table .eval-cell-input--score {
  max-width: 4.5rem;
  width: 4.5rem;
  height: 1.45rem;
  min-height: 1.45rem;
  margin: 0 auto;
  text-align: center;
  padding: 0.04rem 0.25rem;
  font-size: 0.8125rem;
  line-height: 1.2;
  box-sizing: border-box;
}
.bonus-genre-total-row td {
  background: #f5f8ff !important;
  font-weight: 700;
}
.bonus-genre-total-label {
  color: #3b6fd4 !important;
}
.bonus-genre-total-label,
.bonus-total-label {
  text-align: right;
  padding-right: 0.75rem !important;
}
.bonus-total-row td {
  background: #f3f4ff;
  font-weight: 700;
}
.bonus-total-label {
  color: #333;
}
.eval-category-card-head--inline {
  padding: 0;
  background: transparent;
  border: 0;
  min-height: 0;
}
.bonus-form-editor-body {
  padding: 1rem;
}
.bonus-form-preview-body {
  padding: 0.75rem 1rem 1rem;
}
.bonus-form-editor-body,
.bonus-form-preview-body {
  --bonus-genre: #3b6fd4;
  --bonus-genre-soft: #f5f8ff;
  --bonus-dept: #2f7a5b;
  --bonus-dept-soft: #f3faf6;
  --bonus-minor: #3b7ea3;
  --bonus-minor-soft: #f3f9fd;
  --bonus-item-soft: #f5f6ff;
  --bonus-item: #4338ca;
}
.bonus-editor-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.2rem 0.65rem;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 700;
  margin-bottom: 0.65rem;
}
.bonus-editor-badge--genre { background: var(--bonus-genre-soft); color: var(--bonus-genre); }
.bonus-editor-badge--major { background: var(--bonus-dept-soft); color: var(--bonus-dept); }
.bonus-editor-badge--minor { background: var(--bonus-minor-soft); color: var(--bonus-minor); }
.bonus-editor-badge--item { background: var(--bonus-item-soft); color: var(--bonus-item); }
.bonus-editor-selected-name {
  font-size: 1.05rem;
  font-weight: 700;
  line-height: 1.35;
  color: #1c2b1a;
}
.bonus-editor-section-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.2rem 0.65rem;
  border-radius: 999px;
  font-size: 0.72rem;
  font-weight: 700;
  line-height: 1.2;
}
.bonus-editor-section-badge--major {
  background: var(--bonus-dept-soft);
  color: var(--bonus-dept);
}
.bonus-editor-section-badge--minor {
  background: var(--bonus-minor-soft);
  color: var(--bonus-minor);
}
.bonus-editor-section-badge--item {
  background: var(--bonus-item-soft);
  color: var(--bonus-item);
}
.bonus-editor-section {
  border-top: 2px solid #e2ebe0;
  margin-top: 1rem;
  padding-top: 1rem;
}
.bonus-editor-section--flush {
  border-top: 1px solid #e2ebe0;
}
.bonus-editor-member {
  display: flex;
  gap: 0.55rem;
  align-items: flex-start;
  padding: 0.4rem 0;
  border-bottom: 1px solid #f0f4ef;
}
.bonus-editor-member.is-active {
  background: #f7faf6;
  box-shadow: inset 3px 0 0 #4CBBB4;
}
.bonus-editor-member-body {
  flex: 1;
  min-width: 0;
}
.bonus-editor-member-avatar {
  width: 1.85rem;
  height: 1.85rem;
  border-radius: 50%;
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.75rem;
  font-weight: 700;
  flex-shrink: 0;
  margin-top: 0.05rem;
}
.bonus-editor-member-avatar--major {
  background: var(--bonus-dept);
}
.bonus-editor-member-avatar--minor {
  background: var(--bonus-minor);
}
.bonus-editor-member-avatar--item {
  background: #6b7280;
}
.bonus-editor-member-name-row {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  min-width: 0;
}
.bonus-editor-member-select {
  flex: 1;
  min-width: 0;
  border: 0;
  background: transparent;
  padding: 0;
  text-align: left;
  cursor: pointer;
}
.bonus-editor-member-name {
  font-weight: 650;
  font-size: 0.88rem;
  color: #1c2b1a;
}
.bonus-editor-member-edit {
  flex-shrink: 0;
  width: 1.65rem;
  height: 1.65rem;
  border: 0;
  border-radius: 0.35rem;
  background: transparent;
  color: #9ca3af;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.bonus-editor-member-edit:hover {
  background: #edf3ff;
  color: #2f6fed;
}
.bonus-editor-inline-edit {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  width: 100%;
}
.bonus-editor-inline-edit-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
}
.bonus-editor-register-row {
  width: 100%;
  display: flex;
  align-items: flex-start;
  gap: 0.45rem;
}
/* 賞与フォームの名称入力: 1行の高さから始め、改行・折り返しに合わせて伸ばす */
textarea.bonus-name-textarea.grow-textarea {
  min-height: 2.5rem;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  line-height: 1.4;
}
.bonus-editor-member-name,
.bonus-editor-selected-name,
.bonus-preview-cell-label,
.bonus-score-table:not(.bonus-score-table--interactive) td.bonus-cell-group,
.bonus-score-table:not(.bonus-score-table--interactive) td.bonus-cell-item {
  white-space: pre-line;
}
.bonus-score-table--interactive .bonus-cell-item .bonus-preview-cell-label {
  white-space: pre;
}
.bonus-editor-register-row .form-control {
  flex: 1 1 auto;
  min-width: 0;
}
.bonus-editor-register-row .btn {
  flex-shrink: 0;
  white-space: nowrap;
}
.bonus-editor-register-score {
  flex: 0 0 4rem !important;
  max-width: 4rem;
  text-align: center;
}
.bonus-score-table--interactive .bonus-preview-cell.is-selectable {
  position: relative;
  vertical-align: middle;
  padding: 0.28rem 1.15rem !important;
  height: auto;
  line-height: 1.3 !important;
  cursor: pointer;
  transition: background-color 0.12s ease;
}
.bonus-score-table--interactive .bonus-cell-max.is-selectable,
.bonus-score-table--interactive .bonus-cell-remark.is-selectable,
.bonus-score-table--interactive .bonus-cell-boss.is-selectable {
  padding: 0.28rem 0.4rem !important;
}
.bonus-score-table--interactive .bonus-preview-cell.is-selectable:hover {
  filter: brightness(0.98);
}
.bonus-score-table--interactive .bonus-cell-item.is-selected,
.bonus-score-table--interactive .bonus-cell-max.is-selected,
.bonus-score-table--interactive .bonus-cell-remark.is-selected,
.bonus-score-table--interactive .bonus-cell-boss.is-selected {
  background: #f0fdf4;
}
.bonus-preview-cell-block {
  position: static;
  box-sizing: border-box;
}
.bonus-cell-group .bonus-preview-cell-block {
  display: block;
  text-align: center;
}
.bonus-cell-genre .bonus-preview-cell-label { color: var(--bonus-genre, #3b6fd4); }
.bonus-cell-major .bonus-preview-cell-label { color: var(--bonus-dept, #2f7a5b); }
.bonus-cell-minor .bonus-preview-cell-label { color: var(--bonus-minor, #3b7ea3); }
.bonus-cell-group .bonus-preview-cell-label {
  display: block;
  width: 100%;
  text-align: center;
}
.bonus-cell-item .bonus-preview-cell-block {
  display: block;
  text-align: left;
}
.bonus-preview-cell-label {
  font-weight: inherit;
  line-height: 1.3;
  max-width: 100%;
}
.bonus-cell-item .bonus-preview-cell-label {
  display: block;
  text-align: left;
}
.bonus-score-table--interactive .bonus-preview-cell .bonus-preview-cell-remove,
.bonus-score-table--interactive .bonus-preview-cell-block .bonus-preview-cell-remove {
  position: absolute;
  top: 0.08rem;
  right: 0.08rem;
  transform: none;
  margin: 0 !important;
  width: 0.95rem !important;
  height: 0.95rem !important;
  font-size: 0.75rem !important;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  pointer-events: auto;
  z-index: 2;
  cursor: pointer;
}
.eval-form-split__body--preview .bonus-form-section {
  border: 0;
  border-radius: 0;
  background: transparent;
}
.bonus-form-preview-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(15.5rem, 22rem);
  gap: 0.85rem 1rem;
  align-items: stretch;
}
.bonus-form-preview-table-col,
.bonus-form-score-memo-col {
  min-width: 0;
}
.bonus-form-score-memo-section--preview {
  height: 100%;
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  padding: 0.75rem 0.85rem 0.9rem;
}
.bonus-form-score-memo-label {
  font-size: 0.8125rem;
  font-weight: 700;
  color: #333;
  margin: 0 0 0.4rem;
}
.bonus-form-score-memo-input {
  flex: 1 1 auto;
  width: 100%;
  min-height: 16rem;
  font-size: 0.875rem;
  line-height: 1.55;
  resize: vertical;
}
.bonus-form-score-memo-display {
  font-size: 0.875rem;
  line-height: 1.55;
  color: #333;
  white-space: pre-wrap;
  overflow-wrap: break-word;
  word-break: keep-all;
}
.bonus-score-criteria-modal__panel {
  width: min(24rem, 92vw) !important;
  max-height: min(80vh, 40rem);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.bonus-score-criteria-modal__body {
  overflow-y: auto;
  margin: 0;
  padding: 0.15rem 0.1rem 0.25rem;
  font-size: 0.875rem;
  line-height: 1.55;
  font-weight: 400;
  color: #333;
  text-align: left;
  white-space: pre-wrap;
  overflow-wrap: break-word;
  word-break: keep-all;
  font-family: inherit;
}
@media (max-width: 991.98px) {
  .bonus-form-preview-layout {
    grid-template-columns: 1fr;
  }
  .bonus-form-score-memo-input {
    min-height: 10rem;
  }
}
.eval-form-split__body--preview .bonus-table-scroll-wrap {
  overflow: visible;
}
.bonus-handover-section {
  margin-top: 1rem;
  padding: 0;
  border: none;
  background: transparent;
}
.bonus-form-section .bonus-handover-section {
  margin-top: 0;
  padding: 0.75rem 1rem 1rem;
  border-top: 1px solid #e5e7eb;
  background: #fff;
}
.bonus-form-section .bonus-form-memo-section--display {
  margin-top: 0;
  padding: 0.75rem 1rem 1rem;
  border-top: 1px solid #e5e7eb;
  background: #fff;
}
.bonus-handover-title {
  font-size: 0.875rem;
  font-weight: 700;
  color: #333;
  margin: 0 0 0.5rem;
}
.bonus-handover-role {
  font-weight: 600;
}
.bonus-handover-memo {
  width: 100%;
  min-height: 4.5rem;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  background: #fff;
  color: #333;
  font-size: 0.875rem;
  line-height: 1.6;
  padding: 0.65rem 0.75rem;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
  box-shadow: none;
}
.bonus-handover-memo.is-placeholder {
  color: #9ca3af;
}
.bonus-handover-memo.is-readonly {
  background: #f3f4f6;
}
textarea.bonus-handover-memo.grow-textarea {
  resize: vertical;
  background: #fff;
}
textarea.bonus-handover-memo.grow-textarea:focus {
  background: #fff;
  border-color: #4CBBB4;
  outline: none;
  box-shadow: 0 0 0 3px rgba(76, 187, 180, 0.15);
}
.bonus-form-memo-section {
  width: 100%;
}
.bonus-form-memo-section--meta {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  column-gap: 0.65rem;
  row-gap: 0.35rem;
}
.bonus-form-memo-section--preview,
.bonus-form-memo-section--display {
  margin-top: 0;
  padding: 0.75rem 1rem 1rem;
  border-top: 1px solid #e5e7eb;
  background: #fff;
}
.bonus-form-memo-section--preview .bonus-form-memo-label {
  display: block;
  margin-bottom: 0.35rem;
}
.bonus-form-memo-section--preview .bonus-form-memo-input {
  width: 100%;
}
.bonus-form-memo-preview {
  margin-top: 0.75rem;
}
.bonus-form-memo-label {
  grid-column: 1;
  grid-row: 1;
  margin: 0;
  font-size: 0.8125rem;
  font-weight: 600;
  color: #6b7280;
  white-space: nowrap;
  line-height: 1.6;
}
.bonus-form-memo-input {
  grid-column: 2;
  grid-row: 1;
  width: 100%;
  min-height: 5.5rem;
  font-size: 0.875rem;
  line-height: 1.6;
  resize: vertical;
}
.bonus-form-memo-section--preview .bonus-form-memo-input {
  min-height: 6.5rem;
  font-weight: 700;
  color: #4CBBB4;
}
.bonus-form-memo-display {
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 1.65;
  color: #4CBBB4;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
}
.eval-period-meta-memo {
  width: 100%;
  min-width: 0;
}
.bonus-score-table tbody tr:nth-child(even):not(.bonus-genre-total-row):not(.bonus-total-row) td.bonus-cell-item,
.bonus-score-table tbody tr:nth-child(even):not(.bonus-genre-total-row):not(.bonus-total-row) td.bonus-cell-max,
.bonus-score-table tbody tr:nth-child(even):not(.bonus-genre-total-row):not(.bonus-total-row) td.bonus-cell-boss,
.bonus-score-table tbody tr:nth-child(even):not(.bonus-genre-total-row):not(.bonus-total-row) td.bonus-cell-final {
  background: #fcfcfd;
}

/* 評価 入力テーブル（従業員） */
.eval-locked-msg {
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  color: #B81C22;
  font-size: 0.8125rem;
  font-weight: 600;
}
.eval-goals-confirmed-msg {
  padding: 0;
  color: #2f6b28;
  font-size: 0.8125rem;
  font-weight: 600;
}
.eval-goals-preview-note {
  padding: 0.75rem 1rem;
  border-radius: 8px;
  background: #f3faf1;
  border: 1px solid #cfe6cb;
  color: #3d5340;
  font-size: 0.875rem;
}
.eval-table-scroll-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.eval-input-table {
  width: 100%;
  min-width: 920px;
  border-collapse: collapse;
  font-size: 0.8125rem;
}
.eval-input-table th,
.eval-input-table td {
  border: 1px solid #e5e7eb;
  padding: 0.5rem 0.6rem;
  vertical-align: top;
}
.eval-input-table thead th {
  background: #E6F7F5;
  color: #0086A0;
  font-weight: 700;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
}
.eval-input-table .eval-col-num {
  width: 2.5rem;
  text-align: center;
  vertical-align: middle;
  font-weight: 600;
  color: #6b7280;
  background: #f9fafb;
}
.eval-input-table .eval-col-actions {
  width: 2.75rem;
  text-align: center;
  vertical-align: middle;
}
.eval-input-table .eval-cell-input--score {
  max-width: 5rem;
  text-align: right;
}
.eval-cell-readonly {
  white-space: pre-wrap;
  color: #333;
  min-height: 1.5rem;
}
.eval-row-add {
  display: inline-block;
  margin: 0.75rem 1rem 1rem;
  padding: 0.4rem 0.875rem;
  background: #fff;
  border: 1.5px solid #d1d5db;
  border-radius: 8px;
  font-size: 0.8125rem;
  color: #333;
  cursor: pointer;
}
.eval-row-add:hover {
  background: #f3f4f6;
}
.eval-row-remove {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.75rem;
  height: 1.75rem;
  padding: 0;
  background: #fff;
  border: 1.5px solid #e5e7eb;
  border-radius: 6px;
  font-size: 1.125rem;
  line-height: 1;
  color: #9ca3af;
  cursor: pointer;
}
.eval-row-remove:hover:not(:disabled) {
  background: #FDECEC;
  border-color: #fecaca;
  color: #B81C22;
}
.eval-row-remove:disabled,
.eval-row-remove--disabled {
  opacity: 0.45;
  cursor: not-allowed;
}
.eval-cat-section-body.p-0 .eval-table-scroll-wrap {
  border-radius: 0;
}

/* ── 権限マスタ：管理機能 checkboxes ── */
.authority-features {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  max-width: 28rem;
}
.authority-features__section {
  border: 1px solid #e5e7eb;
  border-radius: 0.5rem;
  overflow: hidden;
  background: #fff;
}
.authority-features__section-label {
  padding: 0.45rem 0.85rem;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: #6b7280;
  background: #f3f4f6;
  border-bottom: 1px solid #e5e7eb;
}
.authority-features__list {
  display: flex;
  flex-direction: column;
}
.authority-features__item {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  margin: 0;
  padding: 0.65rem 0.85rem;
  cursor: pointer;
  border-bottom: 1px solid #f3f4f6;
  transition: background-color 0.12s ease;
}
.authority-features__item:last-child {
  border-bottom: 0;
}
.authority-features__item--child {
  padding-left: 1.85rem;
}
.authority-features__item.is-disabled {
  cursor: not-allowed;
  opacity: 0.55;
}
.authority-features__item.is-disabled .authority-features__check {
  cursor: not-allowed;
}
.authority-features__item:hover {
  background: #f8faf8;
}
.authority-features__item.is-disabled:hover {
  background: transparent;
}
.authority-features__check {
  width: 1.1rem;
  height: 1.1rem;
  margin: 0;
  flex-shrink: 0;
  cursor: pointer;
  accent-color: #4CBBB4;
}
.authority-features__name {
  font-size: 0.9rem;
  font-weight: 600;
  color: #333;
  line-height: 1.35;
}

/* Keep labels aligned with the input control when validation errors appear */
.form-field-row,
.page-content .row.g-2:has(> [class*="col"] .form-control),
.page-content .row.g-2:has(> [class*="col"] .form-select),
.page-content .row.g-2:has(> label.col-form-label) {
  align-items: flex-start !important;
}
.form-field-row > label.col-form-label,
.form-field-row > label.col-form-label.small,
.page-content .row.g-2 > label.col-form-label.small {
  padding-top: 0.4rem;
}

/* Auto-growing textareas (お知らせ本文 and shared fields) */
textarea.grow-textarea {
  overflow-y: hidden;
  resize: none;
  line-height: 1.7;
  white-space: pre-wrap;
  field-sizing: content;
}
textarea.grow-textarea.nf-editor {
  min-height: 9rem;
}
.grow-textarea-display {
  line-height: 1.7;
  white-space: pre-wrap;
  min-height: 2.5rem;
}

/* Shared leave/confirm dialog (組織図・評価) */
.orgchart-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 1090;
  background: rgba(16, 24, 16, 0.45);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
}
.orgchart-confirm-overlay {
  background: rgba(17, 24, 39, 0.5);
  z-index: 2300;
}
.orgchart-confirm-card {
  width: min(100%, 420px);
  background: #fff;
  border-radius: 14px;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.22);
  padding: 1.5rem 1.35rem 1.25rem;
  text-align: center;
}
.orgchart-confirm-icon {
  width: 48px;
  height: 48px;
  margin: 0 auto 0.85rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.35rem;
  font-weight: 700;
  line-height: 1;
}
.orgchart-confirm-icon.is-warning {
  background: #fef9c3;
  color: #ca8a04;
}
.orgchart-confirm-title {
  margin: 0 0 0.5rem;
  font-size: 1.1rem;
  font-weight: 700;
  color: #333;
}
.orgchart-confirm-message {
  margin: 0 0 0.85rem;
  font-size: 0.95rem;
  line-height: 1.7;
  color: #4b5563;
}
.orgchart-confirm-actions {
  display: flex;
  justify-content: center;
  gap: 0.65rem;
}

.eval-period-parent-row > td,
.eval-period-child-row > td {
  padding-top: 0.4rem !important;
  padding-bottom: 0.4rem !important;
  line-height: 1.3;
}
.eval-period-parent-row.has-children > td {
  border-bottom: none !important;
}
.eval-period-child-row > td {
  border-bottom: none !important;
}
.eval-period-child-row.is-last > td {
  border-bottom-width: 1px !important;
  border-bottom-style: solid !important;
  border-bottom-color: var(--bs-table-border-color, #dee2e6) !important;
}
.eval-period-child-row td:first-child {
  padding-left: 3.25rem !important;
}
.eval-period-child-name {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  color: #4b5563;
  font-weight: 600;
}
.eval-period-tree-guide {
  display: inline-block;
  width: 0.7rem;
  height: 0.7rem;
  border-left: 1.5px solid #c4c4c4;
  border-bottom: 1.5px solid #c4c4c4;
  margin-bottom: 0;
  flex-shrink: 0;
}
.eval-create-mode-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  max-width: 100%;
}
.eval-create-mode-list > .eval-select-row {
  flex: 0 1 auto;
  width: fit-content;
  max-width: 100%;
  margin-bottom: 0;
  align-items: center;
  white-space: nowrap;
}
.eval-select-row {
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
  padding: 0.65rem 0.75rem;
  border: 1px solid #e5ebe4;
  border-radius: 0.5rem;
  margin-bottom: 0.5rem;
  cursor: pointer;
  background: #fff;
}
.eval-select-row:hover {
  background: #f7fbf6;
}
.eval-select-row .form-check-input {
  margin-top: 0.2rem;
  flex-shrink: 0;
  border: 1px solid #ced4da;
  box-shadow: none;
  outline: none;
}
.eval-select-row .form-check-input:focus,
.eval-select-row .form-check-input:focus-visible,
.eval-select-row .form-check-input:checked {
  border-color: #4CBBB4;
  box-shadow: none;
  outline: none;
}
.eval-wizard-scroll {
  overflow: visible;
  max-height: none;
}

/* 不定期削除確認 — app-confirm と同じカード（! アイコン＋中央ボタン）＋削除対象 */
.irr-del-overlay {
  z-index: 2500;
  isolation: isolate;
}
.irr-del-card {
  width: min(100%, 420px);
  background: #ffffff !important;
  opacity: 1 !important;
}
.irr-del-message {
  margin-bottom: 1rem;
}
.irr-del-target {
  margin: 0 0 1.25rem;
  padding: 0.75rem 0.9rem;
  background: #fafafa;
  border: 1px solid #eee;
  border-radius: 0.5rem;
  text-align: left;
}
.irr-del-target-label {
  font-weight: 700;
  font-size: 0.9rem;
  color: #333;
  margin-bottom: 0.55rem;
}
.irr-del-target .form-check {
  margin-bottom: 0.45rem;
  min-height: auto;
  padding-left: 1.6rem;
}
.irr-del-target .form-check:last-child {
  margin-bottom: 0;
}
.irr-del-target .form-check-label {
  font-size: 0.9rem;
  color: #333;
  cursor: pointer;
}
.irr-del-target .form-check-input {
  margin-top: 0.2rem;
}
.irr-del-target .form-check-input:checked {
  background-color: var(--hirakumo-brand, #4CBBB4);
  border-color: var(--hirakumo-brand, #4CBBB4);
}

/* 一覧: 最後にクリックした行（js/list-row-highlight.js） */
:root {
  --list-row-last-clicked-bg: #e8f8f5;
}
.page-content table > tbody > tr.is-row-action {
  cursor: pointer;
}
.page-content table > tbody > tr.is-row-last-clicked > *,
.page-content .table-hover > tbody > tr.is-row-last-clicked:hover > * {
  --bs-table-bg-state: var(--list-row-last-clicked-bg);
  background-color: var(--list-row-last-clicked-bg) !important;
}

/* ===== ヒラクモ AI — Edge/Copilot-style docked side panel ===== */
:root {
  --ai-side-panel-width: min(420px, 100vw);
}
.ai-panel-toggle-btn {
  line-height: 1;
}
.ai-panel-toggle-btn.active {
  background: rgba(76, 187, 180, 0.18);
  border-color: var(--hirakumo-brand, #4CBBB4);
}
.ai-panel-toggle-icon {
  width: 1.25rem;
  height: 1.25rem;
  display: block;
}
/* Floating AI launcher — radial hover menu (fab-menu.html) */
.ai-fab-wrap {
  position: fixed;
  right: 2.5rem; /* clear vertical scrollbar */
  bottom: 2.75rem; /* closer to footer; still clear of radial menu items */
  z-index: 1035;
  width: 3.25rem;
  height: 3.25rem;
  transition: transform 0.35s cubic-bezier(0.2, 0.8, 0.2, 1), opacity 0.3s;
}
/* Invisible hover bridge so the menu stays open across gaps (mouse only) */
.ai-fab-wrap::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  width: 0;
  height: 0;
  pointer-events: none;
}
.ai-fab-wrap.is-open::after {
  width: 210px;
  height: 210px;
  pointer-events: auto;
}
.ai-fab-toggle {
  position: absolute;
  inset: 0;
  z-index: 3;
  display: grid;
  place-items: center;
  width: 3.25rem;
  height: 3.25rem;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: #fff;
  color: var(--hirakumo-brand, #4CBBB4);
  box-shadow:
    0 4px 14px rgba(15, 23, 42, 0.12),
    0 1px 3px rgba(15, 23, 42, 0.08);
  cursor: pointer;
  transition: transform 0.5s cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 0.15s ease;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}
.ai-fab-wrap.is-open .ai-fab-toggle {
  transform: rotate(90deg);
  box-shadow:
    0 8px 22px rgba(15, 23, 42, 0.16),
    0 2px 6px rgba(15, 23, 42, 0.1);
}
/* Desktop hover open — not on touch (sticky :hover kept the menu stuck open) */
@media (hover: hover) and (pointer: fine) {
  .ai-fab-wrap:hover::after {
    width: 210px;
    height: 210px;
    pointer-events: auto;
  }
  .ai-fab-wrap:hover .ai-fab-toggle {
    transform: rotate(90deg);
    box-shadow:
      0 8px 22px rgba(15, 23, 42, 0.16),
      0 2px 6px rgba(15, 23, 42, 0.1);
  }
}
.ai-fab-toggle:focus-visible {
  outline: none;
  box-shadow:
    0 8px 22px rgba(15, 23, 42, 0.16),
    0 0 0 3px rgba(76, 187, 180, 0.35);
}
.ai-fab-toggle__icon {
  width: 1.55rem;
  height: 1.55rem;
  display: block;
}
.ai-fab-toggle__icon--white {
  display: none;
}
/* Solid theme: green background + white star */
.ai-fab-wrap.is-theme-solid .ai-fab-toggle,
html.ai-fab-theme-solid .ai-fab-wrap .ai-fab-toggle {
  background: var(--hirakumo-brand, #4CBBB4);
  color: #fff;
}
.ai-fab-wrap.is-theme-solid .ai-fab-toggle__icon--teal,
html.ai-fab-theme-solid .ai-fab-wrap .ai-fab-toggle__icon--teal {
  display: none;
}
.ai-fab-wrap.is-theme-solid .ai-fab-toggle__icon--white,
html.ai-fab-theme-solid .ai-fab-wrap .ai-fab-toggle__icon--white {
  display: block;
}
/* Theme menu swatch: half green / half white */
.ai-fab-item--theme {
  overflow: hidden;
  background: transparent;
  padding: 0;
}
.ai-fab-theme-swatch {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: linear-gradient(
    135deg,
    var(--hirakumo-brand, #4CBBB4) 0 50%,
    #fff 50% 100%
  );
  box-shadow: inset 0 0 0 1px rgba(15, 23, 42, 0.08);
}
.ai-fab-item--theme:hover,
.ai-fab-item--theme:focus-visible {
  background: transparent;
  color: inherit;
}
.ai-fab-item--theme:hover .ai-fab-theme-swatch,
.ai-fab-item--theme:focus-visible .ai-fab-theme-swatch {
  box-shadow:
    inset 0 0 0 1px rgba(15, 23, 42, 0.08),
    0 0 0 2px rgba(76, 187, 180, 0.35);
}
.ai-fab-item {
  position: absolute;
  left: 0.4rem;
  top: 0.4rem;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 2.5rem;
  height: 2.5rem;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: #fff;
  color: #334155;
  box-shadow: 0 3px 10px rgba(15, 23, 42, 0.14);
  cursor: pointer;
  opacity: 0;
  pointer-events: none;
  transform: translate(0, 0) rotate(0) scale(0.3);
  transition:
    transform 0.45s cubic-bezier(0.2, 0.9, 0.3, 1.2),
    opacity 0.25s,
    background 0.15s,
    color 0.15s;
  transition-delay: 0s;
}
.ai-fab-item i {
  font-size: 1.05rem;
  line-height: 1;
}
.ai-fab-item:hover,
.ai-fab-item:focus-visible {
  background: var(--hirakumo-brand, #4CBBB4);
  color: #fff;
  outline: none;
}
.ai-fab-wrap.is-open .ai-fab-item {
  opacity: 1;
  pointer-events: auto;
  transform: translate(var(--x), var(--y)) rotate(360deg) scale(1);
  transition-delay: calc(var(--i) * 70ms);
}
@media (hover: hover) and (pointer: fine) {
  .ai-fab-wrap:hover .ai-fab-item {
    opacity: 1;
    pointer-events: auto;
    transform: translate(var(--x), var(--y)) rotate(360deg) scale(1);
    transition-delay: calc(var(--i) * 70ms);
  }
}
.ai-fab-item::before {
  content: attr(data-label);
  position: absolute;
  bottom: calc(100% + 6px);
  left: 50%;
  transform: translateX(-50%);
  background: #1f2937;
  color: #fff;
  font-size: 11px;
  font-weight: 600;
  padding: 3px 7px;
  border-radius: 5px;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.15s;
}
.ai-fab-item:hover::before,
.ai-fab-item:focus-visible::before {
  opacity: 1;
}
/* Move mode — dashed outline while placing */
.ai-fab-wrap.is-moving {
  transition: none;
  touch-action: none;
}
.ai-fab-wrap.is-moving .ai-fab-toggle {
  outline: 3px dashed var(--hirakumo-brand, #4CBBB4);
  outline-offset: 4px;
  cursor: grabbing;
  transform: none !important;
  touch-action: none;
}
.ai-fab-wrap.is-moving .ai-fab-item {
  display: none;
}
.ai-fab-wrap.is-dragging,
.ai-fab-wrap.is-dragging .ai-fab-toggle {
  cursor: grabbing;
  touch-action: none;
  user-select: none;
}
/* User hid FAB — keep ヒラクモ AI icon, low opacity; tap to restore */
.ai-fab-wrap.is-hidden,
html.ai-fab-user-hidden .ai-fab-wrap {
  opacity: 0.22;
}
.ai-fab-wrap.is-hidden:hover,
html.ai-fab-user-hidden .ai-fab-wrap:hover {
  opacity: 0.4;
}
/* No hover-bridge while hidden — it was stealing clicks from the AI button */
.ai-fab-wrap.is-hidden::after,
html.ai-fab-user-hidden .ai-fab-wrap::after {
  width: 0 !important;
  height: 0 !important;
  pointer-events: none !important;
}
.ai-fab-wrap.is-hidden .ai-fab-item,
html.ai-fab-user-hidden .ai-fab-wrap .ai-fab-item {
  display: none !important;
}
.ai-fab-wrap.is-hidden .ai-fab-toggle,
html.ai-fab-user-hidden .ai-fab-wrap .ai-fab-toggle {
  transform: none !important;
  pointer-events: auto;
  cursor: pointer;
}
/* Hide FAB while the docked AI panel is open / on full /ai page */
html.ai-panel-open .ai-fab-wrap,
html.ai-full-page .ai-fab-wrap {
  display: none !important;
}
@media (max-width: 575.98px) {
  .ai-fab-wrap {
    right: 2.25rem;
    bottom: 2.5rem;
    width: 3rem;
    height: 3rem;
  }
  .ai-fab-toggle {
    width: 3rem;
    height: 3rem;
  }
  .ai-fab-toggle__icon {
    width: 1.4rem;
    height: 1.4rem;
  }
  .ai-fab-item {
    left: 0.3rem;
    top: 0.3rem;
    width: 2.4rem;
    height: 2.4rem;
  }
}
/* Persist wrapper: collapsed by default so it does not reserve row space */
#app-screen > [x-persist="hirakumo-ai-side-panel"] {
  display: none;
  flex: 0 0 0;
  width: 0;
  max-width: 0;
  min-width: 0;
  min-height: 0;
  align-self: stretch;
  overflow: hidden;
}
.ai-side-panel {
  display: none;
  flex: 1 1 auto;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  min-height: 0;
  height: 100%;
  overflow: hidden;
  background: #fff;
  border-left: 1px solid #e5e7eb;
  box-shadow: -4px 0 18px rgba(15, 23, 42, 0.08);
  z-index: 1040;
}
/* Open state on <html> survives wire:navigate body morph (no close/open flash).
   Width belongs on the persist wrapper (row flex item). Inner panel fills height —
   do NOT set flex-basis: 420px on the column child or the panel becomes ~420px tall. */
html.ai-panel-open #app-screen > [x-persist="hirakumo-ai-side-panel"] {
  display: flex;
  flex-direction: column;
  flex: 0 0 var(--ai-side-panel-width);
  width: var(--ai-side-panel-width);
  max-width: var(--ai-side-panel-width);
  align-self: stretch;
  height: auto;
  min-height: 0;
  overflow: hidden;
}
html.ai-panel-open #app-screen > .ai-side-panel,
html.ai-panel-open #app-screen > [x-persist="hirakumo-ai-side-panel"] > .ai-side-panel {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  width: 100%;
  max-width: 100%;
  height: 100%;
  min-height: 0;
}
.ai-side-panel-inner {
  display: flex;
  flex-direction: column;
  min-height: 0;
  height: 100%;
  width: 100%;
}
.ai-side-panel-head {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  /* Match main .topbar height so both banners align */
  height: 52px;
  min-height: 52px;
  max-height: 52px;
  padding: 0 0.85rem;
  border-bottom: 1px solid #e5e7eb;
  background: #fff;
  box-sizing: border-box;
}
.ai-side-panel-title {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-weight: 700;
  font-size: var(--type-heading-sm, 0.95rem);
  color: var(--hirakumo-ink, #1f2937);
  min-width: 0;
  line-height: 1.2;
}
.ai-side-panel-title-icon {
  width: 1.2rem;
  height: 1.2rem;
  flex-shrink: 0;
}
.ai-side-panel-head-actions {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  flex-shrink: 0;
}
.ai-side-panel-head .ai-chat-tool-btn,
.ai-side-panel-close {
  width: 1.85rem;
  height: 1.85rem;
  min-width: 1.85rem;
  min-height: 1.85rem;
}
.ai-side-panel-close {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #64748b;
  cursor: pointer;
}
.ai-side-panel-close:hover {
  background: #f1f5f9;
  color: #333;
}
.ai-side-panel-body {
  position: relative;
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.ai-chat-layout--panel {
  flex: 1 1 auto;
  min-height: 0;
  height: 100%;
  /* Full-width chat — no permanent history column / icon strip */
  padding-right: 0 !important;
}
.ai-side-panel .ai-chat-layout--panel {
  display: flex;
  width: 100%;
}
.ai-side-panel .ai-chat-main {
  width: 100%;
}
.ai-side-panel .ai-chat-hero--panel {
  padding: 1.25rem 1rem;
}
.ai-side-panel .ai-chat-hero-title {
  font-size: 1.05rem;
}
/* History drawer: hidden until ☰ is clicked */
.ai-side-history {
  position: absolute;
  inset: 0;
  z-index: 5;
  display: flex;
  flex-direction: column;
}
.ai-side-history-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.2);
}
.ai-side-history-sheet {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  width: 100%;
  max-height: 100%;
  background: #fff;
  border-bottom: 1px solid #e5e7eb;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.12);
}
.ai-side-history-sheet > .ai-chat-history-search {
  padding-top: 0.65rem;
  padding-bottom: 0.55rem;
  border-bottom: 1px solid #eef2f6;
  margin-bottom: 0.55rem;
}
.ai-side-history .ai-chat-history-content {
  max-height: min(50vh, 22rem);
  overflow: auto;
}
.ai-side-history-sheet .ai-chat-history-list {
  padding-top: 0.15rem;
}
@media (max-width: 991.98px) {
  html.ai-panel-open #app-screen > [x-persist="hirakumo-ai-side-panel"] {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    flex: none;
    width: min(100vw, 420px);
    max-width: 100vw;
    height: 100vh;
    height: 100dvh;
    z-index: 1085;
  }
  html.ai-panel-open #app-screen > .ai-side-panel,
  html.ai-panel-open #app-screen > [x-persist="hirakumo-ai-side-panel"] > .ai-side-panel {
    position: relative;
    top: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    max-width: 100%;
    height: 100%;
    z-index: auto;
  }
  html.ai-panel-open:not(.ai-full-page) #app-screen::after {
    content: '';
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.35);
    z-index: 1080;
    pointer-events: none;
  }
}