:root {
  --ink: #18333d;
  --muted: #62717a;
  --surface: #fffefb;
  --canvas: #f3f5f1;
  --line: #d7dfdc;
  --accent: #f2b643;
  --accent-dark: #a76310;
  --brand: #123d4b;
  --brand-2: #1f6474;
  --danger: #bb4238;
  --shadow: 0 14px 38px rgb(18 61 75 / 14%);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--ink);
  background: var(--canvas);
}

* { box-sizing: border-box; }
body { margin: 0; min-width: 320px; background: var(--canvas); }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 3px solid rgb(242 182 67 / 55%); outline-offset: 2px;
}

.app-shell { min-height: 100vh; }
.topbar {
  position: sticky; top: 0; z-index: 10; display: flex; align-items: center; gap: 20px;
  min-height: 68px; padding: 10px 28px; color: #fff; background: var(--brand); box-shadow: 0 2px 8px rgb(0 0 0 / 14%);
}
.brand { display: flex; align-items: center; gap: 10px; min-width: max-content; font-weight: 800; letter-spacing: -.02em; }
.brand-mark { display: grid; place-items: center; width: 32px; height: 32px; border: 2px solid var(--accent); border-radius: 9px; color: var(--accent); font-size: 18px; }
.brand small { display: block; color: #a8cad1; font-size: 10px; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
.nav { display: flex; align-items: center; gap: 2px; overflow-x: auto; }
.nav button { border: 0; border-radius: 7px; padding: 9px 11px; color: #d6e7e9; background: transparent; white-space: nowrap; }
.nav button:hover, .nav button.active { color: #172c31; background: var(--accent); }
.top-actions { display: flex; gap: 7px; margin-left: auto; }
.icon-button, .button { border: 1px solid var(--line); border-radius: 8px; padding: 8px 11px; color: var(--ink); background: white; font-weight: 650; }
.top-actions .icon-button { color: #e7f4f4; border-color: #5a8993; background: transparent; }
.top-actions .icon-button:hover { background: #285966; }
.button:hover, .icon-button:hover { border-color: #92aaa9; background: #f9faf6; }
.button.primary { border-color: var(--accent); background: var(--accent); color: #372300; }
.button.primary:hover { background: #f8c95f; }
.button.danger { color: #9f302b; border-color: #e2aaa4; background: #fff7f5; }
.button.ghost { color: var(--brand-2); background: transparent; }
.button:disabled { cursor: not-allowed; opacity: .52; }

.workspace { max-width: 1800px; margin: 0 auto; padding: 22px 28px 32px; }
.plan-layout { display: grid; grid-template-columns: 266px minmax(0, 1fr); gap: 18px; }
.side-panel, .content-card { border: 1px solid var(--line); border-radius: 12px; background: var(--surface); box-shadow: 0 2px 6px rgb(24 51 61 / 4%); }
.side-panel { align-self: start; overflow: hidden; }
.panel-block { padding: 16px; border-bottom: 1px solid var(--line); }
.panel-block:last-child { border-bottom: none; }
.panel-heading { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin: 0 0 11px; color: var(--muted); font-size: 11px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.select, .text-input, .textarea { width: 100%; border: 1px solid #c9d5d1; border-radius: 7px; padding: 8px 9px; color: var(--ink); background: #fff; }
.textarea { min-height: 86px; resize: vertical; }
.employee-list { display: grid; gap: 3px; max-height: 410px; overflow: auto; }
.employee-row { display: flex; align-items: center; gap: 8px; width: 100%; border: 0; border-radius: 7px; padding: 8px; text-align: left; color: var(--ink); background: transparent; }
.employee-row:hover { background: #f3f7f4; }
.employee-row.active { color: #0f404d; background: #dfeeed; font-weight: 750; }
.person-dot { flex: 0 0 auto; width: 10px; height: 10px; border-radius: 50%; background: var(--person-color, #6ca29a); }
.subtle { color: var(--muted); font-size: 12px; }
.legend { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.legend-item { display: flex; align-items: center; gap: 6px; min-width: 0; font-size: 12px; }
.legend-swatch { width: 12px; height: 12px; border-radius: 3px; }

.content-card { min-width: 0; overflow: hidden; }
.toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: 9px; padding: 14px 16px; border-bottom: 1px solid var(--line); background: #fbfcf8; }
.month-switch { display: flex; align-items: center; gap: 7px; margin-right: auto; }
.month-label { min-width: 182px; text-align: center; font-size: 18px; font-weight: 800; letter-spacing: -.02em; }
.compact { padding: 6px 8px; font-size: 13px; }
.mode-pills { display: flex; flex-wrap: wrap; gap: 5px; }
.mode-pills button { border: 1px solid var(--line); border-radius: 99px; padding: 6px 9px; color: #516269; background: #fff; font-size: 12px; }
.mode-pills button.active { border-color: #78a49c; color: #104b54; background: #e0efec; font-weight: 750; }
.hint-bar { min-height: 34px; padding: 8px 16px; color: #53666b; background: #fff8df; font-size: 12px; }
.grid-scroll { overflow: auto; max-height: calc(100vh - 252px); }
.schedule { display: grid; grid-template-columns: 190px repeat(var(--days), minmax(42px, 1fr)); min-width: 1280px; }
.schedule > * { min-height: 37px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.cell-head { position: sticky; top: 0; z-index: 3; display: grid; place-items: center; padding: 3px; color: #4f5e60; background: #eef2ef; font-size: 11px; font-weight: 700; }
.cell-head.weekend { color: #856000; background: #fff3b8; }
.cell-head.today { color: #fff; background: var(--brand-2); }
.name-cell { position: sticky; left: 0; z-index: 2; display: flex; align-items: center; gap: 8px; padding: 7px 9px; background: #fffefb; font-size: 13px; font-weight: 650; }
.name-cell.group-start { border-top: 2px solid #9cbdb5; }
.schedule-cell { position: relative; display: grid; place-items: center; padding: 2px; overflow: hidden; color: #4c5d61; background: #fff; font-size: 12px; }
.schedule-cell.weekend { background: #fffef1; }
.schedule-cell.marked-period { box-shadow: inset 0 3px 0 var(--period-color, #579c98); }
.schedule-cell.vacation-blocked { background-image: repeating-linear-gradient(-45deg, rgb(185 75 75 / 10%) 0 5px, transparent 5px 10px); }
.period-mark { position: absolute; top: 0; left: 0; right: 0; height: 3px; }
.block-mark { position: absolute; right: 2px; top: 1px; color: #9d3030; font-size: 10px; font-weight: 800; }
.schedule-cell:hover { outline: 2px solid #579c98; outline-offset: -2px; z-index: 1; }
.entry { display: grid; place-items: center; width: 100%; height: 100%; min-height: 28px; border-radius: 4px; padding: 2px; font-size: 11px; font-weight: 850; line-height: 1.05; text-align: center; }
.entry small { display: block; overflow: hidden; max-width: 100%; color: inherit; font-size: 8px; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.entry.absence { border: 1px dashed rgb(0 0 0 / 15%); }
.requirement-badge { position: absolute; right: 2px; bottom: 1px; color: #986719; font-size: 9px; }
.requirement-badge.under { border-radius: 2px; padding: 0 2px; color: #fff; background: #d40000; font-weight: 850; }
.requirement-badge.over { color: #a23b31; font-weight: 800; }
.stats-table { width: 100%; border-collapse: collapse; min-width: 940px; }
.stats-table th, .stats-table td { border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 8px 10px; text-align: right; font-size: 12px; }
.stats-table th { position: sticky; top: 0; color: #516267; background: #eef2ef; text-align: left; font-size: 11px; }
.stats-table td:first-child { text-align: left; font-weight: 700; }
.stats-table .negative { color: var(--danger); font-weight: 750; }
.stats-table .positive { color: #16705b; font-weight: 750; }

.page { display: grid; gap: 18px; }
.page-head { display: flex; align-items: end; justify-content: space-between; gap: 16px; }
.eyebrow { margin: 0 0 5px; color: var(--brand-2); font-size: 11px; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; }
h1 { margin: 0; font-size: clamp(24px, 3vw, 34px); letter-spacing: -.04em; }
h2 { margin: 0; font-size: 18px; letter-spacing: -.02em; }
.lede { max-width: 790px; margin: 8px 0 0; color: var(--muted); }
.cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.metric { padding: 16px; }
.metric .label { color: var(--muted); font-size: 12px; font-weight: 700; }
.metric .value { margin-top: 8px; font-size: 27px; font-weight: 850; letter-spacing: -.04em; }
.metric .detail { margin-top: 5px; color: var(--muted); font-size: 12px; }
.admin-grid { display: grid; grid-template-columns: minmax(250px, .72fr) minmax(0, 1.4fr); gap: 18px; }
.admin-list { overflow: hidden; }
.list-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 9px; padding: 12px 14px; border-bottom: 1px solid var(--line); }
.list-item { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; border: 0; border-bottom: 1px solid #edf0ed; padding: 12px 14px; color: var(--ink); background: transparent; text-align: left; }
.list-item:hover, .list-item.active { background: #eff6f2; }
.list-item strong, .list-item span { display: block; }
.list-item span { margin-top: 3px; color: var(--muted); font-size: 12px; }
.detail-panel { padding: 18px; }
.detail-panel p { color: var(--muted); }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.form-grid .full { grid-column: 1 / -1; }
label { display: grid; gap: 5px; color: #516267; font-size: 12px; font-weight: 750; }
.form-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.form-actions .danger { margin-left: auto; }
.group-planning-fields { display: grid; gap: 22px; margin-top: 26px; padding-top: 20px; border-top: 1px solid var(--line); }
.group-planning-fields h3, .restriction-fields h3 { margin: 0 0 5px; font-size: 15px; }
.compact-table { width: 100%; margin: 10px 0; border-collapse: collapse; font-size: 12px; }
.compact-table th, .compact-table td { padding: 6px 7px; border: 1px solid var(--line); text-align: left; }
.compact-table th { background: #eef3f1; color: #41555a; }
.inline-form { margin-top: 12px; padding: 12px; background: #f7faf8; border: 1px solid var(--line); border-radius: 7px; }
.inline-form .button { margin-top: 12px; }
.restriction-fields { padding: 14px; background: #f7faf8; border: 1px solid var(--line); border-radius: 7px; }
.restriction-table { text-align: center; }
.restriction-table th:not(:first-child), .restriction-table td { text-align: center; }
.restriction-table input { width: 16px; height: 16px; accent-color: #b24646; }
.reports-page { gap: 13px; }
.report-page-head { align-items: center; min-height: 64px; padding: 0 2px 10px; border-bottom: 1px solid #cbd3d1; }
.report-page-head h1 { font-size: 26px; }
.report-page-head .lede { margin-top: 3px; font-size: 13px; }
.report-head-actions { display: flex; align-items: center; gap: 7px; }
.report-workbench { display: grid; grid-template-columns: 225px 330px minmax(520px, 1fr); align-items: start; gap: 12px; min-width: 0; }
.report-library, .report-options { position: sticky; top: 83px; max-height: calc(100vh - 102px); border-radius: 7px; box-shadow: 0 3px 12px rgb(18 61 75 / 7%); }
.report-library { overflow: auto; }
.report-library > header { display: grid; gap: 2px; padding: 14px 15px 12px; border-bottom: 1px solid var(--line); background: linear-gradient(#fbfcfa, #f2f5f2); }
.report-library > header span, .report-settings-head span { color: var(--brand-2); font-size: 10px; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.report-library > header strong { font-size: 16px; }
.report-library > header small { color: var(--muted); font-size: 11px; }
.report-menu { display: grid; padding: 5px; }
.report-menu-group { border-bottom: 1px solid #e4e9e6; }
.report-menu-group:last-child { border-bottom: 0; }
.report-menu-heading { display: grid; grid-template-columns: minmax(0, 1fr) auto 15px; align-items: center; gap: 7px; width: 100%; border: 0; padding: 9px 8px; color: #2d3b3e; background: transparent; text-align: left; font-size: 12px; font-weight: 750; }
.report-menu-heading:hover { background: #edf3f1; }
.report-menu-heading small { display: grid; place-items: center; min-width: 19px; min-height: 19px; border-radius: 99px; color: #5d6c6f; background: #e5ebE9; font-size: 10px; }
.report-menu-heading b { color: #638084; font-size: 15px; font-weight: 500; text-align: center; }
.report-menu-items { display: none; gap: 2px; padding: 0 4px 6px 12px; }
.report-menu-group.expanded .report-menu-items { display: grid; }
.report-menu-item { display: flex; align-items: center; justify-content: space-between; gap: 8px; width: 100%; border: 0; border-left: 3px solid transparent; padding: 6px 8px; color: #435256; background: transparent; text-align: left; font-size: 11px; }
.report-menu-item:hover { color: #123d4b; background: #f0f5f3; }
.report-menu-item.active { border-left-color: #1b7d8b; color: #fff; background: #177a8b; font-weight: 800; }
.report-menu-item b { font-size: 11px; }
.report-options { display: grid; grid-template-rows: auto auto auto auto minmax(0, 1fr) auto; overflow: hidden; padding: 0; }
.report-settings-head { display: flex; align-items: center; min-height: 60px; padding: 11px 14px; background: linear-gradient(#fbfcfa, #f0f4f1); }
.report-settings-head > div { display: grid; gap: 2px; }
.report-settings-head strong { overflow: hidden; max-width: 290px; font-size: 15px; text-overflow: ellipsis; white-space: nowrap; }
.report-settings-tabs { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: #f6f8f6; }
.report-settings-tabs button { border: 0; border-right: 1px solid var(--line); border-bottom: 3px solid transparent; padding: 8px 5px 6px; color: #506164; background: transparent; font-size: 11px; }
.report-settings-tabs button:last-child { border-right: 0; }
.report-settings-tabs button:hover { background: #edf4f2; }
.report-settings-tabs button.active { border-bottom-color: #1d7785; color: #0f5260; background: #e8f2f2; font-weight: 850; }
.report-settings-tabs small { display: inline-grid; place-items: center; min-width: 17px; min-height: 17px; margin-left: 2px; border-radius: 99px; background: #d6e3e2; font-size: 9px; }
.report-group-strip { display: grid; gap: 5px; padding: 8px 12px; border-bottom: 1px solid var(--line); background: #fbfcfa; }
.report-group-strip > span { color: #617175; font-size: 9px; font-weight: 850; letter-spacing: .09em; text-transform: uppercase; }
.report-group-strip > div { display: flex; flex-wrap: wrap; gap: 4px; }
.report-group-strip button { border: 1px solid #c7d2cf; border-radius: 99px; padding: 4px 8px; color: #40565b; background: #fff; font-size: 10px; }
.report-group-strip button:hover { border-color: #7fa4a1; background: #edf5f3; }
.report-group-strip button.active { border-color: #1b7785; color: #fff; background: #1b7785; font-weight: 800; }
.report-elements { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px 8px; margin: 8px 11px 5px; border: 1px solid #cbd3d1; padding: 9px 10px 8px; background: #fbfcfa; }
.report-elements legend { padding: 0 5px; color: #3d5054; font-size: 10px; font-weight: 800; }
.report-elements .check-row { min-width: 0; font-size: 10px; font-weight: 650; }
.report-settings-body { min-height: 0; overflow: auto; }
.report-settings-section { display: grid; gap: 12px; padding: 15px; }
.report-settings-section h3 { margin: 0; color: #23383d; font-size: 14px; }
.report-settings-section h3:not(:first-child) { margin-top: 8px; padding-top: 12px; border-top: 1px solid var(--line); }
.report-section-title { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.report-section-title > div:first-child { display: grid; gap: 2px; }
.report-section-title small, .report-help { color: var(--muted); font-size: 11px; }
.report-help { margin: 1px 0 0; padding: 9px 10px; border-left: 3px solid #7eaaa7; background: #f2f7f5; line-height: 1.4; }
.report-mini-actions { display: flex; gap: 4px; }
.report-mini-actions button { border: 1px solid #c8d4d1; border-radius: 4px; padding: 4px 7px; color: #32555c; background: #fff; font-size: 10px; }
.report-mini-actions button:hover { border-color: #7ea39f; background: #edf5f3; }
.report-date-grid, .report-size-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.check-row { display: flex; align-items: center; gap: 8px; color: #405256; font-weight: 650; }
.check-row input { flex: 0 0 auto; width: auto; }
.report-check-grid { display: grid; gap: 9px; }
.report-settings-footer { display: flex; align-items: center; gap: 9px; padding: 10px 13px; border-top: 1px solid var(--line); background: #f6f8f5; }
.report-settings-footer .button { flex: 0 0 auto; }
.report-settings-footer span { color: var(--muted); font-size: 9px; line-height: 1.25; }
.report-preview { min-width: 0; min-height: calc(100vh - 165px); border-radius: 7px; padding: 0; background: #dfe4e2; box-shadow: 0 3px 12px rgb(18 61 75 / 7%); }
.report-preview-toolbar { position: sticky; top: 70px; z-index: 3; display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 48px; padding: 7px 12px; border-bottom: 1px solid #bbc5c2; background: rgb(247 249 247 / 96%); backdrop-filter: blur(5px); }
.report-preview-toolbar > div { display: grid; gap: 1px; }
.report-preview-toolbar strong { font-size: 13px; }
.report-preview-toolbar span { color: var(--muted); font-size: 10px; }
.report-preview-stage { min-width: 0; min-height: calc(100vh - 214px); overflow: auto; padding: 23px; background: repeating-linear-gradient(45deg, #e6eae8 0 12px, #e3e7e5 12px 24px); }
.report-paper { width: 100%; max-width: 840px; min-height: 610px; margin: 0 auto; padding: 38px; border: 1px solid #d5d5cf; background: #fff; box-shadow: 0 12px 30px rgb(27 46 50 / 16%); font-size: var(--report-font-size, 9pt); }
.report-paper.landscape { max-width: 1120px; }
.report-paper h2 { margin-top: 0; }
.print-page { min-height: 510px; padding: 0; }
.print-page + .print-page { margin-top: 36px; padding-top: 36px; border-top: 3px dashed #c8d1cd; }
.print-page-head { margin-bottom: 14px; }
.print-person { margin: -5px 0 0; color: #355b5b; font-weight: 800; }
.print-page footer { margin-top: 16px; color: var(--muted); font-size: 11px; text-align: right; }
.plan-report + .plan-report { margin-top: 24px; padding-top: 18px; border-top: 1px solid #dfe5e1; }
.plan-report h3 { margin: 0 0 8px; color: #234d56; font-size: 15px; }
.report-notes { display: grid; gap: 4px; margin-top: 16px; padding: 10px 12px; border-left: 3px solid #86aaa5; color: #465c60; background: #f4f8f5; font-size: 11px; }
.report-table-wrap { overflow: auto; }
.report-paper table { width: 100%; border-collapse: collapse; margin-top: 18px; }
.report-paper th, .report-paper td { border-bottom: 1px solid #dfe2db; padding: 8px; text-align: left; font-size: inherit; }
.report-paper th { background: #eef2ef; white-space: nowrap; }
.report-paper .plan-report table { min-width: max-content; }
.report-paper .plan-report th, .report-paper .plan-report td { min-width: 34px; padding: 4px; text-align: center; font-size: inherit; }
.report-paper .plan-report th:first-child, .report-paper .plan-report td:first-child { position: sticky; left: 0; z-index: 1; width: var(--report-name-width, 3cm); min-width: var(--report-name-width, 3cm); text-align: left; background: #fff; font-weight: 750; }
.report-paper .plan-report th:first-child { background: #eef2ef; }
.report-entry { display: block; min-width: 21px; padding: 2px; border-radius: 2px; font-weight: 850; }
.report-legend { display: flex; flex-wrap: wrap; gap: 5px 13px; margin: 16px 0 0; font-size: 11px; }
.report-legend span { display: inline-flex; align-items: center; gap: 4px; }
.report-legend i, .color-dot { display: inline-block; width: 11px; height: 11px; border-radius: 2px; vertical-align: middle; }
.legacy-export-head { margin-bottom: 10px; }
.legacy-export-head h1 { margin: 0 0 9px; border-top: 2px solid #111; border-bottom: 2px solid #111; padding: 4px 0 3px; color: #111; font-family: Arial, sans-serif; font-size: 14pt; letter-spacing: 0; }
.legacy-export-head p { margin: 0 0 7px; color: #111; font-family: Arial, sans-serif; font-size: 10pt; }
.legacy-plan-report { margin: 0; padding: 0; border: 0; }
.legacy-plan-report + .legacy-plan-report { margin-top: 18px; padding-top: 0; border-top: 0; }
.legacy-plan-scroll { width: 100%; overflow: hidden; padding: 0; }
.report-paper .legacy-plan-table { width: 100%; min-width: 0; margin: 0; border: 1px solid #777; border-collapse: collapse; table-layout: fixed; color: #050505; font-family: Arial, sans-serif; }
.report-paper .legacy-plan-table th, .report-paper .legacy-plan-table td { box-sizing: border-box; width: auto; min-width: 0; height: 24px; overflow: hidden; border: 1px solid #aaa; padding: 0; color: #050505; background: #fff; text-align: center; text-overflow: clip; font-size: 8pt; font-weight: 400; line-height: 1; white-space: nowrap; }
.report-paper .legacy-plan-table thead tr:first-child th { height: 20px; border-color: #555; font-size: 9pt; font-weight: 400; }
.report-paper .legacy-plan-table .legacy-month-cell { position: static; z-index: auto; width: var(--report-name-width, 3cm); min-width: 0; border-color: #444; padding: 0; color: #050505; background: #f2f2f2; text-align: center; vertical-align: middle; }
.legacy-month-cell strong, .legacy-month-cell span { display: block; width: 100%; font-size: 10pt; font-weight: 400; line-height: 1.45; text-align: center; }
.report-paper .legacy-plan-table .legacy-day-head { height: 38px; font-size: 8pt; }
.report-paper .legacy-plan-table .legacy-day-head:first-child { position: static; z-index: auto; width: auto; min-width: 0; text-align: center; }
.legacy-day-head strong, .legacy-day-head span { display: block; line-height: 1.35; }
.legacy-day-head strong { font-size: 9pt; font-weight: 400; }
.report-paper .legacy-plan-table .weekend { background: var(--report-day-color, #fff200); }
.report-paper .legacy-plan-table .holiday { background: var(--report-day-color, #f08080); }
.report-paper .legacy-plan-table tbody th:first-child { position: static; z-index: auto; width: var(--report-name-width, 3cm); min-width: 0; height: 24px; padding: 2px 4px; color: #050505; background: #fff; text-align: left; font-size: 8pt; font-weight: 400; }
.report-paper .legacy-plan-table .legacy-report-group th { background: #d2d2d2; font-weight: 750; }
.report-paper .legacy-plan-table .legacy-report-group td { background: #d2d2d2; }
.report-paper .legacy-plan-table .legacy-report-group .weekend { background: var(--report-day-color, #fff200); }
.report-paper .legacy-plan-table .legacy-report-group .holiday { background: var(--report-day-color, #f08080); }
.legacy-entry-stack { display: grid; width: 100%; min-height: 22px; }
.legacy-report-entry { display: grid; place-items: center; width: 100%; min-width: 0; min-height: 22px; overflow: hidden; padding: 1px 0 4px; color: var(--entry-text, #17252a); background: var(--entry-bg, #eee); box-shadow: inset 0 -4px var(--entry-bar, #00ff00); font-size: 7pt; font-weight: 750; line-height: 1; }
.legacy-report-entry.absence { outline: 1px dashed rgb(0 0 0 / 20%); outline-offset: -1px; }
.legacy-report-staffing th, .legacy-report-staffing td { font-weight: 750 !important; }
.legacy-plan-legend { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 24px; margin-top: 10px; color: #111; font-family: Arial, sans-serif; }
.legacy-plan-legend > span { display: inline-flex; align-items: center; gap: 7px; font-size: 10pt; white-space: nowrap; }
.legacy-plan-legend i { display: grid; place-items: center; width: 40px; height: 28px; color: var(--entry-text, #17252a); background: var(--entry-bg, #eee); box-shadow: inset 0 -4px var(--entry-bar, #00ff00); font-size: 8pt; font-style: normal; font-weight: 750; }
.legacy-plan-statistics { margin-top: 20px; color: #111; font-family: Arial, sans-serif; }
.legacy-plan-statistics h3 { margin: 0 0 10px; font-size: 10pt; font-weight: 400; }
.report-paper .legacy-plan-statistics table { width: 100%; margin: 0; border-collapse: collapse; }
.report-paper .legacy-plan-statistics th, .report-paper .legacy-plan-statistics td { border: 1px solid #777; padding: 3px 5px; color: #111; background: #fff; font-size: 9pt; }
.report-paper .legacy-plan-statistics th { border-bottom: 2px solid #111; font-weight: 750; }
.report-paper .legacy-plan-statistics th:nth-child(n+3), .report-paper .legacy-plan-statistics td:nth-child(n+3) { text-align: right; }
.legacy-print-page { display: flex; flex-direction: column; min-height: 650px; }
.legacy-print-page > footer { display: flex; justify-content: space-between; gap: 20px; margin-top: auto; padding-top: 5px; border-top: 1px solid #111; color: #111; font-family: Arial, sans-serif; font-size: 9pt; text-align: left; }
.report-employee-list { display: grid; gap: 1px; max-height: calc(100vh - 285px); overflow: auto; padding: 3px 0; }
.report-employee-list .check-row { min-height: 28px; border-bottom: 1px solid #edf0ee; padding: 4px 2px; }

@media (max-width: 1350px) {
  .report-workbench { grid-template-areas: "library options" "preview preview"; grid-template-columns: 235px minmax(0, 1fr); }
  .report-library { grid-area: library; position: static; max-height: 520px; }
  .report-options { grid-area: options; position: static; max-height: 520px; }
  .report-preview { grid-area: preview; }
}
@media (max-width: 760px) {
  .report-page-head { display: grid; }
  .report-head-actions { margin-top: 9px; }
  .report-workbench { display: grid; grid-template-areas: "library" "options" "preview"; grid-template-columns: 1fr; }
  .report-library, .report-options { max-height: none; }
  .report-preview-stage { padding: 10px; }
  .report-paper { padding: 22px; }
}

/* Die klassischen Desktopflächen stehen später in der Datei und benötigen
   deshalb abschließende Augenmodus-Überschreibungen. */
:root[data-theme="dark"] .classic-header,
:root[data-theme="dark"] .classic-commandbar,
:root[data-theme="dark"] .classic-menubar,
:root[data-theme="dark"] .desktop-modal,
:root[data-theme="dark"] .modal-titlebar,
:root[data-theme="dark"] .classic-admin-page .detail-panel,
:root[data-theme="dark"] .classic-admin-page .manager-pane,
:root[data-theme="dark"] .classic-admin-page .requirement-shift,
:root[data-theme="dark"] .classic-admin-page .requirement-cell,
:root[data-theme="dark"] .classic-admin-page .requirements-table thead th,
:root[data-theme="dark"] .classic-admin-page .list-item,
:root[data-theme="dark"] .report-settings,
:root[data-theme="dark"] .report-menu,
:root[data-theme="dark"] .report-preview-toolbar { color: var(--ink) !important; background: #222b2e !important; border-color: var(--line) !important; }
:root[data-theme="dark"] .classic-command:hover,
:root[data-theme="dark"] .classic-more button:hover,
:root[data-theme="dark"] .classic-view-tabs button:hover,
:root[data-theme="dark"] .classic-admin-page .list-item:hover { background: #303d41 !important; }

@media (prefers-color-scheme: dark) {
  :root[data-theme="auto"] .classic-header,
  :root[data-theme="auto"] .classic-commandbar,
  :root[data-theme="auto"] .classic-menubar,
  :root[data-theme="auto"] .desktop-modal,
  :root[data-theme="auto"] .modal-titlebar,
  :root[data-theme="auto"] .classic-admin-page .detail-panel,
  :root[data-theme="auto"] .classic-admin-page .manager-pane,
  :root[data-theme="auto"] .classic-admin-page .requirement-shift,
  :root[data-theme="auto"] .classic-admin-page .requirement-cell,
  :root[data-theme="auto"] .classic-admin-page .requirements-table thead th,
  :root[data-theme="auto"] .classic-admin-page .list-item,
  :root[data-theme="auto"] .report-settings,
  :root[data-theme="auto"] .report-menu,
  :root[data-theme="auto"] .report-preview-toolbar { color: var(--ink) !important; background: #222b2e !important; border-color: var(--line) !important; }
}

/* Onlinebetrieb: Anmeldung, Rollen, Benutzerkonten und Sicherungen. */
.auth-page { min-height: 100vh; display: grid; place-items: center; padding: 24px; background: radial-gradient(circle at 20% 10%, #dcebe8 0, transparent 38%), linear-gradient(135deg, #edf3ef, #cddedc); }
.auth-card { width: min(440px, 100%); border: 1px solid #b6c8c5; border-radius: 14px; padding: 30px; background: var(--surface); box-shadow: 0 24px 70px rgb(14 48 57 / 18%); }
.auth-card h1 { margin-top: 26px; }
.auth-card > p { margin: 9px 0 22px; color: var(--muted); line-height: 1.55; }
.auth-card footer { margin-top: 24px; border-top: 1px solid var(--line); padding-top: 15px; color: var(--muted); font-size: 10px; text-align: center; }
.auth-brand { display: flex; align-items: center; gap: 11px; }
.auth-brand > span { display: grid; place-items: center; width: 45px; height: 45px; border-radius: 10px; color: #fff; background: var(--brand); font-size: 15px; font-weight: 900; }
.auth-brand strong, .auth-brand small { display: block; }
.auth-brand strong { font-size: 18px; }
.auth-brand small { margin-top: 2px; color: var(--brand-2); font-size: 10px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.auth-form { display: grid; gap: 14px; }
.auth-form .button { min-height: 42px; margin-top: 4px; }
.auth-error { border-left: 4px solid var(--danger); padding: 9px 11px; color: #8f302b !important; background: #fff0ed; font-size: 12px; }
.auth-loading { width: 34px; height: 34px; margin: 30px auto; border: 4px solid #d7e3e0; border-top-color: var(--brand-2); border-radius: 50%; animation: auth-spin .8s linear infinite; }
@keyframes auth-spin { to { transform: rotate(360deg); } }

.online-header { display: flex; align-items: center; gap: 5px; margin-left: auto; }
.online-header > button, .theme-switch { min-height: 22px; border: 1px solid #c5cecd; border-radius: 3px; padding: 2px 6px; color: #314246; background: #fff; font-size: 10px; font-style: normal; font-weight: 600; }
.online-header > button:hover { border-color: #7f9998; background: #edf4f3; }
.online-save { display: inline-flex; align-items: center; gap: 4px; margin-right: 2px; color: #526164; font-size: 9px; }
.online-save::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: #d6952d; }
.online-save[data-state="saved"]::before { background: #239166; }
.online-save[data-state="error"]::before { background: #c23d34; }
.theme-switch { display: flex; align-items: center; gap: 4px; padding: 1px 3px 1px 6px; }
.theme-switch select { border: 0; padding: 1px 2px; color: inherit; background: transparent; font-size: inherit; }
.theme-switch option { color: #172a30; background: #fff; }
.request-center-button { position: relative; }
.request-center-button b { display: inline-grid; place-items: center; min-width: 15px; height: 15px; margin-left: 4px; border-radius: 99px; color: #fff; background: #c3483f; font-size: 8px; }

.online-accounts-grid { display: grid; grid-template-columns: 330px minmax(0, 1fr); gap: 12px; }
.online-users-page { gap: 10px; }
.online-users-page .admin-list { max-height: 490px; overflow: auto; }
.account-state { flex: 0 0 auto; border-radius: 99px; padding: 3px 6px; color: #805c26; background: #fff0cc; font-size: 9px; font-weight: 800; }
.account-state.ready { color: #1f6d50; background: #dff3e9; }
.online-backups { margin-top: 12px; }
.online-backups .list-toolbar > div { display: grid; gap: 2px; }
.online-backup-table { max-height: 265px; overflow: auto; padding: 0 12px 12px; }

.online-dialog { width: min(1120px, calc(100vw - 36px)); max-width: none; }
.request-dialog { min-width: 0; }
.request-dialog-grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(320px, .65fr); min-height: 430px; }
.request-list, .request-new { min-width: 0; padding: 18px; }
.request-list { display: grid; align-content: start; gap: 9px; max-height: min(680px, calc(100vh - 110px)); overflow: auto; border-right: 1px solid var(--line); }
.request-list h2, .request-new h2 { margin-bottom: 5px; }
.request-card { border: 1px solid var(--line); border-left: 5px solid #6c8991; border-radius: 5px; padding: 10px 11px; background: var(--surface); }
.request-card.vacation { border-left-color: #9d6ac4; }
.request-card.wish { border-left-color: #2686ad; }
.request-card.swap { border-left-color: #df8b25; }
.request-card.rejected, .request-card.overridden { opacity: .7; }
.request-card > header, .request-card > div, .request-card > footer { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; }
.request-card > header { justify-content: space-between; }
.request-card > header span { border-radius: 99px; padding: 3px 7px; color: #835b17; background: #fff0c8; font-size: 9px; font-weight: 850; text-transform: uppercase; }
.request-card.approved > header span { color: #176446; background: #dff4e8; }
.request-card.rejected > header span, .request-card.overridden > header span { color: #7d3733; background: #f4dfdd; }
.request-card > div { margin-top: 6px; color: var(--muted); font-size: 11px; }
.request-card p { margin: 7px 0; font-size: 12px; }
.request-card small { display: block; margin-top: 6px; color: var(--muted); }
.request-card footer { margin-top: 8px; }
.request-card-button { width: 100%; color: inherit; font: inherit; text-align: left; cursor: pointer; }
.request-card-button:hover { border-color: var(--brand-2); background: color-mix(in srgb, var(--surface) 88%, var(--brand-2)); }
.planner-request-dialog .request-list { min-width: 320px; }
.planner-request-summary { display: grid; gap: 5px; margin: 12px 0 18px; border-left: 4px solid var(--brand-2); border-radius: 6px; padding: 12px 14px; background: var(--surface); }
.planner-request-summary span { color: var(--muted); font-size: 12px; }
.planner-request-summary p { margin: 4px 0 0; }
.request-new { background: color-mix(in srgb, var(--canvas) 72%, var(--surface)); }
.online-request-stack { position: absolute; inset: 1px; z-index: 6; display: grid; pointer-events: none; }
.online-request-entry { position: relative; display: grid; place-items: center; width: 100%; min-width: 0; min-height: 21px; overflow: hidden; border: 2px dashed color-mix(in srgb, var(--request-text) 78%, transparent); border-radius: 0; padding: 0 2px 3px; color: var(--request-text); background: color-mix(in srgb, var(--request-color) 82%, white); box-shadow: inset 0 -4px 0 color-mix(in srgb, var(--request-color) 72%, #00ef27); font-size: 10px; line-height: 1; text-align: center; pointer-events: auto; cursor: pointer; }
.online-request-entry strong { overflow: hidden; max-width: 100%; text-overflow: ellipsis; white-space: nowrap; }
.online-request-entry small { position: absolute; right: 1px; bottom: 0; max-width: calc(100% - 3px); overflow: hidden; color: inherit; font-size: 6px; font-weight: 850; letter-spacing: -.02em; text-overflow: ellipsis; white-space: nowrap; }
.online-request-entry b { position: absolute; top: 0; right: 0; min-width: 11px; padding: 1px; color: #fff; background: #173f48; font-size: 6px; }
.online-request-entry.approved { border-style: solid; border-color: #1c8d5e; }
.online-request-entry:hover { outline: 2px solid #0b6779; outline-offset: -2px; filter: brightness(1.04); }
.request-card.selected { outline: 2px solid var(--brand-2); outline-offset: -2px; }

/* Rollen: Mitarbeiter sehen nur ihren Plan und die Berichtsfunktionen. */
html[data-online-role="employee"] .classic-command[data-type="employees"],
html[data-online-role="employee"] .classic-commandbar > .classic-command:nth-child(2),
html[data-online-role="employee"] .classic-actionbar .mode-pills,
html[data-online-role="employee"] .classic-more button[data-page="settings"],
html[data-online-role="employee"] .desktop-menu:nth-of-type(3) { display: none !important; }
html[data-online-role="employee"] .schedule-cell { cursor: default; }

/* Augenmodus. Druckausgaben bleiben durch die vorhandenen Druckregeln weiß. */
:root[data-theme="dark"] {
  color-scheme: dark;
  --ink: #e3ecec;
  --muted: #a6b5b8;
  --surface: #20282b;
  --canvas: #151b1e;
  --line: #3a484b;
  --brand: #101719;
  --brand-2: #62aebb;
  --shadow: 0 14px 38px rgb(0 0 0 / 35%);
}
@media (prefers-color-scheme: dark) {
  :root[data-theme="auto"] {
    color-scheme: dark;
    --ink: #e3ecec; --muted: #a6b5b8; --surface: #20282b; --canvas: #151b1e; --line: #3a484b; --brand: #101719; --brand-2: #62aebb; --shadow: 0 14px 38px rgb(0 0 0 / 35%);
  }
}

:root[data-theme="dark"] body,
:root[data-theme="dark"] .workspace,
:root[data-theme="dark"] .classic-admin-page .detail-panel,
:root[data-theme="dark"] .desktop-modal,
:root[data-theme="dark"] .nested-modal,
:root[data-theme="dark"] .modal-body,
:root[data-theme="dark"] .settings-content,
:root[data-theme="dark"] .request-new { color: var(--ink); background: var(--canvas); }
:root[data-theme="dark"] .classic-header,
:root[data-theme="dark"] .classic-commandbar,
:root[data-theme="dark"] .classic-menubar,
:root[data-theme="dark"] .modal-titlebar,
:root[data-theme="dark"] .manager-pane,
:root[data-theme="dark"] .requirements-groups fieldset { color: var(--ink); background: #222b2e; border-color: var(--line); }
:root[data-theme="dark"] .classic-menubar span:first-child,
:root[data-theme="dark"] .desktop-menu,
:root[data-theme="dark"] .desktop-menu > button,
:root[data-theme="dark"] .classic-command,
:root[data-theme="dark"] .classic-view-tabs button,
:root[data-theme="dark"] .classic-more button,
:root[data-theme="dark"] .modal-titlebar button { color: var(--ink) !important; }
:root[data-theme="dark"] .classic-command.active { color: var(--ink) !important; background: transparent; border-color: var(--line); }
:root[data-theme="dark"] .classic-view-tabs button.active { color: var(--ink) !important; background: transparent; border-color: transparent; }
:root[data-theme="dark"] .content-card,
:root[data-theme="dark"] .side-panel,
:root[data-theme="dark"] .toolbar,
:root[data-theme="dark"] .settings-group,
:root[data-theme="dark"] .list-item,
:root[data-theme="dark"] .inline-form,
:root[data-theme="dark"] .restriction-fields,
:root[data-theme="dark"] .group-membership,
:root[data-theme="dark"] .shift-coverage,
:root[data-theme="dark"] .contract-days,
:root[data-theme="dark"] .request-card,
:root[data-theme="dark"] .report-settings-section { color: var(--ink); background: var(--surface); border-color: var(--line); }
:root[data-theme="dark"] .text-input,
:root[data-theme="dark"] .select,
:root[data-theme="dark"] .textarea,
:root[data-theme="dark"] .button,
:root[data-theme="dark"] .mode-pills button,
:root[data-theme="dark"] .online-header > button,
:root[data-theme="dark"] .theme-switch { color: var(--ink); background: #293337; border-color: #4a5a5e; }
:root[data-theme="dark"] .button:hover,
:root[data-theme="dark"] .list-item:hover { background: #303d41; }
:root[data-theme="dark"] .classic-group-filter { color: var(--ink); }
:root[data-theme="dark"] .classic-group-filter select { color: #172a30 !important; background: #fff !important; color-scheme: light; }
:root[data-theme="dark"] .hint-bar { color: #e1d39e; background: #393522; }
:root[data-theme="dark"] .desktop-menu-panel,
:root[data-theme="dark"] .desktop-submenu-panel,
:root[data-theme="dark"] .plan-context-menu,
:root[data-theme="dark"] .context-submenu-panel { color: var(--ink) !important; background: #252e31; border-color: #556164; }
:root[data-theme="dark"] .desktop-menu-panel button,
:root[data-theme="dark"] .desktop-submenu-panel button,
:root[data-theme="dark"] .plan-context-menu button { color: var(--ink); }
:root[data-theme="dark"] .auth-page { background: radial-gradient(circle at 20% 10%, #20383a 0, transparent 40%), #101618; }

@media (prefers-color-scheme: dark) {
  :root[data-theme="auto"] body, :root[data-theme="auto"] .workspace, :root[data-theme="auto"] .classic-admin-page .detail-panel, :root[data-theme="auto"] .desktop-modal, :root[data-theme="auto"] .nested-modal, :root[data-theme="auto"] .modal-body, :root[data-theme="auto"] .settings-content, :root[data-theme="auto"] .request-new { color: var(--ink); background: var(--canvas); }
  :root[data-theme="auto"] .classic-header, :root[data-theme="auto"] .classic-commandbar, :root[data-theme="auto"] .classic-menubar, :root[data-theme="auto"] .modal-titlebar, :root[data-theme="auto"] .manager-pane, :root[data-theme="auto"] .requirements-groups fieldset { color: var(--ink); background: #222b2e; border-color: var(--line); }
  :root[data-theme="auto"] .classic-menubar span:first-child, :root[data-theme="auto"] .desktop-menu, :root[data-theme="auto"] .desktop-menu > button, :root[data-theme="auto"] .classic-command, :root[data-theme="auto"] .classic-view-tabs button, :root[data-theme="auto"] .classic-more button, :root[data-theme="auto"] .modal-titlebar button { color: var(--ink) !important; }
  :root[data-theme="auto"] .classic-command.active { color: var(--ink) !important; background: transparent; border-color: var(--line); }
  :root[data-theme="auto"] .classic-view-tabs button.active { color: var(--ink) !important; background: transparent; border-color: transparent; }
  :root[data-theme="auto"] .content-card, :root[data-theme="auto"] .side-panel, :root[data-theme="auto"] .toolbar, :root[data-theme="auto"] .settings-group, :root[data-theme="auto"] .list-item, :root[data-theme="auto"] .inline-form, :root[data-theme="auto"] .restriction-fields, :root[data-theme="auto"] .group-membership, :root[data-theme="auto"] .shift-coverage, :root[data-theme="auto"] .contract-days, :root[data-theme="auto"] .request-card, :root[data-theme="auto"] .report-settings-section { color: var(--ink); background: var(--surface); border-color: var(--line); }
  :root[data-theme="auto"] .text-input, :root[data-theme="auto"] .select, :root[data-theme="auto"] .textarea, :root[data-theme="auto"] .button, :root[data-theme="auto"] .mode-pills button, :root[data-theme="auto"] .online-header > button, :root[data-theme="auto"] .theme-switch { color: var(--ink); background: #293337; border-color: #4a5a5e; }
  :root[data-theme="auto"] .classic-group-filter { color: var(--ink); }
  :root[data-theme="auto"] .classic-group-filter select { color: #172a30 !important; background: #fff !important; color-scheme: light; }
  :root[data-theme="auto"] .hint-bar { color: #e1d39e; background: #393522; }
  :root[data-theme="auto"] .desktop-menu-panel, :root[data-theme="auto"] .desktop-submenu-panel, :root[data-theme="auto"] .plan-context-menu, :root[data-theme="auto"] .context-submenu-panel { color: var(--ink) !important; background: #252e31; border-color: #556164; }
  :root[data-theme="auto"] .auth-page { background: radial-gradient(circle at 20% 10%, #20383a 0, transparent 40%), #101618; }
}

@media (max-width: 900px) {
  .online-header { min-width: max-content; }
  .online-save, .theme-switch > span { display: none; }
  .online-accounts-grid, .request-dialog-grid { grid-template-columns: 1fr; }
  .request-list { max-height: 42vh; border-right: 0; border-bottom: 1px solid var(--line); }
}
.user-rights-fields { margin-top: 10px; padding-top: 12px; border-top: 1px solid var(--line); }
.user-rights-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin: 10px 0 18px; }
.permission-checks { display: grid; grid-template-columns: 1fr 1fr; margin-top: 6px; }
.employee-planning-fields { display: grid; gap: 18px; margin-top: 22px; }
.employee-planning-fields > section { padding-top: 16px; border-top: 1px solid var(--line); }
.employee-planning-fields h3 { margin: 0 0 10px; }
.empty { padding: 28px; color: var(--muted); text-align: center; }
.callout { border-left: 4px solid var(--accent); border-radius: 7px; padding: 12px 14px; color: #5b563c; background: #fff8df; font-size: 13px; }
.dialog { width: min(620px, calc(100vw - 28px)); border: 1px solid var(--line); border-radius: 13px; padding: 0; color: var(--ink); box-shadow: 0 24px 80px rgb(17 41 48 / 35%); }
.dialog::backdrop { background: rgb(14 34 40 / 18%); backdrop-filter: none; }
.dialog-head { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 16px 18px; border-bottom: 1px solid var(--line); cursor: move; user-select: none; touch-action: none; }
.dialog-head button, .dialog-head input, .dialog-head select, .dialog-head textarea, .dialog-head a { cursor: pointer; }
.dialog-body { padding: 18px; }
.dialog-foot { display: flex; justify-content: flex-end; gap: 8px; padding: 14px 18px; border-top: 1px solid var(--line); background: #fbfcf8; }
.entry-options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.entry-option { min-height: 60px; border: 1px solid var(--line); border-radius: 8px; padding: 9px; color: var(--ink); background: #fff; text-align: left; }
.entry-option:hover, .entry-option.active { border-color: #6ca69c; background: #edf7f3; }
.entry-option strong, .entry-option span { display: block; }
.entry-option span { margin-top: 3px; color: var(--muted); font-size: 11px; }
.toast { position: fixed; right: 20px; bottom: 20px; z-index: 20; max-width: 360px; border-radius: 9px; padding: 12px 14px; color: #fff; background: #1b505d; box-shadow: var(--shadow); font-size: 13px; }
.toast.error { background: #a53b34; }

@media (max-width: 1050px) {
  .topbar { gap: 10px; padding: 10px 16px; } .top-actions { display: none; }
  .workspace { padding: 16px; } .plan-layout, .admin-grid, .report-layout { grid-template-columns: 1fr; }
  .side-panel { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .side-panel .panel-block { border-bottom: 0; border-right: 1px solid var(--line); }
  .side-panel .panel-block:nth-child(2n) { border-right: 0; }
  .cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 620px) {
  .topbar { min-height: 58px; } .brand small { display: none; } .nav button { padding: 8px; font-size: 12px; }
  .workspace { padding: 11px; } .side-panel { grid-template-columns: 1fr; } .side-panel .panel-block { border-right: 0; border-bottom: 1px solid var(--line); }
  .toolbar { align-items: stretch; } .month-switch { margin-right: 0; width: 100%; justify-content: space-between; } .mode-pills { width: 100%; }
  .cards, .form-grid, .entry-options { grid-template-columns: 1fr; } .form-grid .full { grid-column: auto; }
  .page-head { display: block; } .page-head .button { margin-top: 14px; }
}
@media print {
  html, body, .report-paper, .report-paper * {
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }
  .topbar, .report-library, .report-options, .report-page-head, .report-preview-toolbar, .toast { display: none !important; }
  .workspace { max-width: none; padding: 0; } .report-workbench { display: block; } .content-card { border: 0; box-shadow: none; }
  .report-preview, .report-preview-stage { display: block; min-height: 0; overflow: visible; padding: 0; background: #fff !important; } .report-paper { max-width: none; min-height: 0; border: 0; box-shadow: none; padding: 0; background: #fff !important; }
  .report-table-wrap { overflow: visible; }
  .legacy-plan-scroll { overflow: visible; }
  .legacy-print-page { min-height: 185mm; }
  .report-paper .legacy-plan-table { width: 100%; min-width: 0; }
  .report-paper .legacy-plan-table th, .report-paper .legacy-plan-table td { width: auto; min-width: 0; }
  .report-paper .legacy-plan-table .legacy-month-cell, .report-paper .legacy-plan-table tbody th:first-child { width: 34mm; min-width: 34mm; }
  .report-entry, .report-legend i, .color-dot { -webkit-print-color-adjust: exact !important; print-color-adjust: exact !important; }
  .print-page { min-height: 0; break-after: page; page-break-after: always; }
  .print-page + .print-page { margin-top: 0; padding-top: 0; border-top: 0; }
  .print-page:last-child { break-after: auto; page-break-after: auto; }
}

/* Klassische, tabellenorientierte Planansicht – bewusst ohne kopierte Markenassets. */
.classic-header {
  position: sticky; top: 0; z-index: 10; display: block; min-height: 0; padding: 0;
  color: #1e2528; background: #f8f8f8; border-bottom: 1px solid #aeb7b7; box-shadow: 0 1px 3px rgb(0 0 0 / 18%);
}
.classic-menubar { display: flex; align-items: center; gap: 18px; height: 27px; padding: 0 10px; border-bottom: 1px solid #d8dede; font-size: 12px; }
.classic-menubar span:first-child { color: #0b4351; font-weight: 850; }
.classic-menubar em { margin-left: auto; color: #6e777a; font-size: 10px; font-style: normal; letter-spacing: .08em; text-transform: uppercase; }
.classic-app-title { margin-right: 2px; }
.desktop-menu { position: relative; align-self: stretch; display: flex; align-items: center; color: #1d2527 !important; font-weight: 400 !important; }
.desktop-menu > button { height: 100%; border: 0; padding: 0 2px; color: #1d2527; background: transparent; font-size: 12px; }
.desktop-menu > button:hover, .desktop-menu.open > button { background: #dce8e8; }
.desktop-menu-panel, .desktop-submenu-panel {
  position: absolute; z-index: 50; display: flex; flex-direction: column; min-width: 260px; padding: 4px 0;
  border: 1px solid #a6aeae; color: #202729 !important; background: #f8f8f8; box-shadow: 3px 5px 12px rgb(0 0 0 / 22%); font-weight: 400 !important;
}
.desktop-menu-panel { top: 26px; left: -7px; }
.desktop-menu-panel button, .desktop-submenu-panel button, .desktop-submenu-trigger {
  display: flex; align-items: center; justify-content: space-between; gap: 24px; width: 100%; min-height: 26px; border: 0;
  padding: 4px 10px 4px 31px; color: #202729; background: transparent; text-align: left; white-space: nowrap; font-size: 12px; font-weight: 400;
}
.desktop-menu-panel button:hover, .desktop-submenu-panel button:hover, .desktop-submenu:hover > .desktop-submenu-trigger, .desktop-submenu.open > .desktop-submenu-trigger { color: #fff; background: #1778b0; }
.desktop-menu-panel kbd, .desktop-submenu-panel kbd { margin-left: auto; color: inherit; background: transparent; font-family: inherit; font-size: 11px; }
.desktop-menu-separator { display: block !important; height: 1px; margin: 4px 7px; background: #c7cccc; }
.desktop-submenu { position: relative; display: block !important; color: #202729 !important; font-weight: 400 !important; }
.desktop-submenu-trigger { padding-left: 31px; }
.desktop-submenu-trigger b { margin-left: auto; font-size: 17px; font-weight: 400; }
.desktop-submenu-panel { display: none; top: -5px; left: calc(100% - 3px); }
.desktop-submenu:hover > .desktop-submenu-panel, .desktop-submenu.open > .desktop-submenu-panel { display: flex; }
.classic-commandbar { display: flex; align-items: stretch; width: 100%; min-height: 43px; overflow-x: auto; overflow-y: hidden; padding: 0 8px; background: linear-gradient(#fff, #eef1f1); scrollbar-width: thin; }
.classic-command { display: grid; grid-template-columns: auto auto; align-items: center; gap: 4px; border: 0; border-right: 1px solid #d4dbda; padding: 4px 10px; color: #222d30; background: transparent; font-size: 12px; }
.classic-command:hover { background: #e2eeee; }
.classic-command.active { box-shadow: inset 0 -3px #1c7082; color: #0f4e59; background: transparent; font-weight: 800; }
.classic-command:first-child { border-left: 1px solid #d4dbda; }
.classic-command:not(:first-child) { font-size: 12px; }
.classic-command::first-letter { color: #1b7583; }
.classic-view-tabs { display: flex; flex: 0 0 auto; align-items: end; gap: 1px; margin-left: 8px; overflow: visible; }
.classic-view-tabs button { border: 1px solid transparent; border-bottom: 0; border-radius: 0; padding: 11px 10px 10px; color: #1f2a2c; background: transparent; font-size: 12px; }
.classic-view-tabs button:hover { background: #edf3f2; }
.classic-view-tabs button.active { border-color: transparent; color: #133f49; background: transparent; box-shadow: inset 0 -3px #1c7082; font-weight: 800; }
.classic-more { display: flex; flex: 0 0 auto; align-items: center; gap: 3px; margin-left: auto; }
.classic-more button { border: 1px solid transparent; padding: 5px 7px; color: #47585b; background: transparent; font-size: 11px; }
.classic-more button:hover { border-color: #b6c7c4; background: #fff; }
.classic-plan { margin: -22px -28px -32px; min-width: 0; background: #e5e8e7; }
.classic-plan .plan-layout { display: grid; grid-template-columns: 205px minmax(0, 1fr); gap: 0; min-height: calc(100vh - 70px); }
.classic-plan .side-panel, .classic-plan .content-card { border: 0; border-radius: 0; box-shadow: none; }
.classic-plan .side-panel { background: #e4e7e6; border-right: 1px solid #aeb7b7; }
.classic-plan .panel-block { padding: 8px 6px; border-color: #c1c9c8; }
.classic-plan .panel-block:first-child { background: #d5dcda; }
.classic-plan .panel-heading { margin-bottom: 5px; color: #2d393b; letter-spacing: 0; text-transform: none; }
.classic-plan .select { border-radius: 1px; padding: 4px; font-size: 12px; }
.classic-plan .employee-list { gap: 0; max-height: none; overflow: visible; }
.classic-plan .employee-row { border-radius: 0; min-height: 26px; padding: 3px 5px; font-size: 12px; }
.classic-plan .employee-row:hover { background: #d4e2df; }
.classic-plan .employee-row.active { color: #192529; background: #b9c0c0; font-weight: 750; }
.classic-plan .person-dot { width: 7px; height: 7px; }
.classic-plan .employee-row .subtle { display: none; }
.classic-plan .legend { grid-template-columns: 1fr; gap: 3px; }
.classic-plan .legend-item { font-size: 11px; }
.classic-plan .classic-schedule-card { background: #fbfbfb; }
.classic-actionbar { min-height: 40px; padding: 5px 10px; border-bottom: 1px solid #aeb7b7; background: #f3f4f4; }
.classic-actionbar .mode-pills { order: 0; gap: 6px; }
.classic-actionbar .mode-pills button { min-width: 130px; border-color: #aab7b7; border-radius: 2px; padding: 5px 7px; color: #1e292c; background: linear-gradient(#fff, #e9eeee); text-align: left; }
.classic-actionbar .mode-pills button.active { border-color: #397b89; color: #fff; background: #1c7082; }
.classic-actionbar .mode-pills button span { float: right; opacity: .7; }
.classic-actionbar .month-switch { margin-left: auto; margin-right: 0; }
.classic-actionbar .month-label { min-width: 166px; font-size: 15px; }
.classic-actionbar .button { border-radius: 1px; padding: 4px 7px; font-size: 11px; }
.classic-plan .hint-bar { min-height: 23px; padding: 4px 8px; color: #425355; background: #e7eaea; border-bottom: 1px solid #bac4c2; font-size: 11px; }
.classic-plan .grid-scroll { max-height: calc(100vh - 280px); }
.classic-plan .schedule { grid-template-columns: 205px repeat(var(--days), minmax(45px, 1fr)); min-width: 1540px; }
.classic-plan .schedule > * { min-height: 27px; border-color: #c2c8c7; }
.classic-plan .cell-head { min-height: 46px; padding: 2px; color: #222d2f; background: #e2e5e4; font-size: 10px; }
.classic-plan .cell-head strong { font-size: 13px; }
.classic-plan .cell-head.weekend { background: #fff200; color: #3d3a09; }
.classic-plan .cell-head.today { color: #fff; background: #477a89; }
.classic-plan .name-cell { min-height: 27px; padding: 3px 6px; background: #e3e5e5; border-right: 1px solid #8e9a99; font-size: 12px; }
.classic-plan .name-cell.group-start { border-top: 2px solid #778685; }
.classic-plan .schedule-cell { min-height: 27px; padding: 1px; background: #f9f9f9; }
.classic-plan .schedule-cell.weekend { background: #fff200; }
.classic-plan .schedule-cell.vacation-blocked { background-image: repeating-linear-gradient(-45deg, rgb(185 75 75 / 14%) 0 4px, transparent 4px 8px); }
.classic-plan .schedule-cell:hover { outline-color: #2c8493; }
.classic-plan .entry { min-height: 23px; border-radius: 0; font-size: 10px; }
.classic-plan .entry small { font-size: 7px; }
.classic-summary { border-top: 1px solid #7d8988; background: #e7e9e9; }
.classic-duty-totals { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); border-bottom: 1px solid #aab3b2; }
.classic-duty-totals > div { display: flex; align-items: center; gap: 5px; min-height: 26px; padding: 4px 7px; border-right: 1px solid #b7c0be; color: #263335; font-size: 11px; }
.classic-duty-totals b { margin-left: auto; color: #0b4e5d; }
.classic-personnel { max-height: 220px; overflow: auto; background: #f7f7f7; }
.classic-summary-title { padding: 6px 7px; color: #1b2020; background: #fff28a; border-bottom: 1px solid #b9b16c; font-size: 13px; font-weight: 850; }
.classic-personnel .stats-table { min-width: 850px; }
.classic-personnel .stats-table th, .classic-personnel .stats-table td { padding: 4px 6px; color: #1e2527; font-size: 10px; }
.classic-personnel .stats-table th { background: #d6d9d9; }

@media (max-width: 1050px) {
  .classic-plan { margin: -16px -16px -32px; }
  .classic-plan .plan-layout { grid-template-columns: 190px minmax(0, 1fr); }
  .classic-plan .side-panel { display: block; }
}
@media (max-width: 620px) {
  .classic-menubar { gap: 9px; overflow: hidden; } .classic-menubar span:nth-child(n+4), .classic-menubar em { display: none; }
  .classic-commandbar { overflow-x: auto; } .classic-command span { display: none; }
  .classic-more { display: none; } .classic-plan { margin: -11px -11px -32px; }
  .classic-plan .plan-layout { grid-template-columns: 150px minmax(0, 1fr); }
  .classic-plan .side-panel .panel-block:nth-child(n) { border-right: 0; border-bottom: 1px solid var(--line); }
  .classic-plan .legend { display: none; } .classic-actionbar .mode-pills button { min-width: 40px; font-size: 0; }
  .classic-actionbar .mode-pills button span { float: none; font-size: 14px; } .classic-actionbar .month-label { min-width: 100px; font-size: 12px; }
}

/* Hauptansicht als durchgehendes Tabellenraster. */
.classic-plan { font-family: var(--plan-font, Arial), sans-serif; font-size: var(--plan-font-size, 10px); }
.classic-plan .classic-schedule-card { min-width: 0; min-height: calc(100vh - 70px); border: 0; border-radius: 0; background: #fff; box-shadow: none; }
.classic-grid-scroll { height: calc(100vh - 134px); overflow-x: hidden; overflow-y: auto; background: #fff; scrollbar-color: #8b9494 #e4e6e6; }
.classic-grid-canvas { display: grid; grid-template-columns: minmax(0, 1fr); align-content: start; width: 100%; min-width: 0; }
.classic-plan .schedule,
.classic-plan .occupancy-grid {
  display: grid;
  grid-template-columns: var(--plan-name-width, 205px) repeat(var(--days), minmax(0, 1fr));
  width: 100%;
  min-width: 0;
}
.classic-plan .schedule > *, .classic-plan .occupancy-grid > * { min-height: 25px; border-right: 1px solid #b9bdbd; border-bottom: 1px solid #b9bdbd; }
.mini-months {
  position: sticky; top: 0; left: 0; z-index: 8; display: grid; grid-row: 1 / 4; grid-template-columns: repeat(6, 1fr);
  align-self: stretch; background: #f2f2f2; border-right: 2px solid #777f80 !important; border-bottom: 2px solid #777f80 !important;
}
.mini-months button { min-width: 0; border: 0; border-right: 1px solid #9ca1a1; border-bottom: 1px solid #9ca1a1; padding: 0; color: #101313; background: linear-gradient(#fff, #e8e8e8); font-size: 15px; }
.mini-months button:hover { background: #dbe7e7; }
.mini-months button.active { color: #fff; background: #397480; font-weight: 800; }
.month-band, .week-band, .classic-plan .cell-head { position: sticky; z-index: 6; display: grid; place-items: center; color: #101414; background: #f7f7f7; font-weight: 650; }
.month-band { top: 0; min-height: 21px !important; color: #0d1772; font-size: 14px; font-weight: 850; }
.week-band { top: 21px; min-height: 20px !important; font-size: 11px; }
.classic-plan .cell-head { top: 41px; min-height: 38px !important; padding: 1px; font-size: 9px; line-height: 1.05; }
.classic-plan .cell-head strong { font-size: 11px; }
.classic-plan .cell-head.weekend, .classic-plan .schedule-cell.weekend, .classic-plan .plan-group-cell.weekend, .classic-plan .blank-plan-cell.weekend,
.classic-plan .occupancy-cell.weekend { color: #151500; background: var(--plan-weekend, #fff200); }
.classic-plan .cell-head.holiday, .classic-plan .schedule-cell.holiday, .classic-plan .plan-group-cell.holiday, .classic-plan .blank-plan-cell.holiday,
.classic-plan .occupancy-cell.holiday { background: var(--plan-holiday, #f08080); }
.classic-plan .cell-head.today, .classic-plan .schedule-cell.today, .classic-plan .occupancy-cell.today { box-shadow: inset 0 0 0 2px var(--plan-today, #ffd08a); }
.plan-group-name { position: sticky; left: 0; z-index: 5; display: flex; align-items: center; padding: 2px 5px; color: #171717; background: #d2d2d2; border-right: 2px solid #777f80 !important; font-size: 11px; font-weight: 850; }
.plan-group-cell { background: #d2d2d2; }
.classic-plan .name-cell { position: sticky; left: 0; z-index: 4; min-height: 25px; padding: 2px 5px; color: #111; background: #f3f3f3; border-right: 2px solid #777f80; font-size: 11px; font-weight: 400; }
.classic-plan .blank-name, .classic-plan .blank-plan-cell { min-height: 25px; background: #fff; }
.classic-plan .schedule-cell { min-height: 25px; border: 0; border-right: 1px solid #b9bdbd; border-bottom: 1px solid #b9bdbd; border-radius: 0; padding: 0; background: #fff; }
.classic-plan .schedule-cell.weekend, .classic-plan .schedule-cell.holiday { padding: 2px; }
.classic-plan .schedule-cell.weekend .entry, .classic-plan .schedule-cell.holiday .entry { min-height: 17px; }
.classic-plan .schedule-cell:hover { outline: 2px solid #117f92; outline-offset: -2px; }
.classic-plan .schedule-cell.missing-shift { outline: 2px solid var(--plan-under, #d40000); outline-offset: -2px; }
.classic-plan .schedule-cell.vacation-blocked { background-image: repeating-linear-gradient(-45deg, color-mix(in srgb, var(--plan-vacation-block) 24%, transparent) 0 4px, transparent 4px 8px); }
.classic-plan .entry { position: relative; width: 100%; min-height: 21px; border: 0; border-radius: 0; padding: 1px 2px 4px; font-size: 10px; font-weight: 500; }
.classic-plan .entry.legacy-bar::after { position: absolute; right: 0; bottom: 0; left: 0; height: 4px; background: #00ef27; content: ""; }
.classic-plan .entry.bar-only { min-height: 10px; margin: 5px 0; }
.classic-plan .entry.short-only { min-height: 21px; background: transparent; font-weight: 650; }
.classic-plan .entry.background-only { min-height: 24px; padding: 0; }
.classic-plan .entry.absence { border: 0; }
.comment-indicator { color: #1b5570; }
.occupancy-grid { border-top: 2px solid #5c6262; background: #fff; }
.occupancy-name { position: sticky; left: 0; z-index: 4; display: flex; align-items: center; padding: 2px 5px; color: #111; background: #f3f3f3; border-right: 2px solid #777f80 !important; font-size: 11px; }
.occupancy-cell { display: grid; place-items: center; color: #111; background: #fff; font-size: 10px; }
.classic-plan .occupancy-cell.under { color: #fff; background: var(--plan-under, #d40000); font-weight: 800; }
.classic-plan .occupancy-cell.over { color: #fff; background: var(--plan-over, #2419e8); font-weight: 800; }
.classic-plan .classic-summary { box-sizing: border-box; width: 100%; min-width: 0; overflow-x: auto; border-top: 4px double #777; background: #fff; }
.classic-plan .classic-summary-title { position: sticky; left: 0; min-width: max-content; padding: 5px 8px; color: #111; background: #fff979; border-bottom: 1px solid #777; font-size: 13px; font-weight: 850; }
.classic-plan .classic-personnel { max-height: none; overflow: visible; background: #fff; }
.classic-plan .detailed-personnel-table { min-width: 1500px; width: max-content; }
.classic-plan .detailed-personnel-table th, .classic-plan .detailed-personnel-table td { min-width: 100px; padding: 3px 5px; border: 1px solid #777; color: #111; background: #fff; font-size: 10px; white-space: nowrap; }
.classic-plan .detailed-personnel-table th { position: static; color: #111; background: #cecece; font-weight: 500; }
.classic-plan .detailed-personnel-table th:first-child, .classic-plan .detailed-personnel-table td:first-child { position: sticky; left: 0; z-index: 2; min-width: var(--plan-name-width, 205px); text-align: left; }
.classic-plan .detailed-personnel-table .personnel-group-row td { color: #fff; background: #050505; font-weight: 850; text-align: left; }
.classic-group-filter { display: flex; align-items: center; gap: 5px; margin-left: 7px; color: #263133; font-size: 10px; }
.classic-group-filter select { max-width: 150px; border: 1px solid #aab7b7; border-radius: 1px; padding: 4px; color: #172a30; background: #fff; color-scheme: light; font-size: 11px; }
.classic-group-filter option { color: #172a30; background: #fff; }

/* Einstellungsdialog mit Kategorien wie in einer Desktop-Anwendung. */
.settings-page { max-width: 1180px; margin: 0 auto; }
.settings-shell { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 0; min-height: 570px; border: 1px solid #aeb8b8; background: #f4f4f4; box-shadow: 0 8px 28px rgb(20 38 42 / 12%); }
.settings-tree { display: flex; flex-direction: column; padding: 12px; border-right: 1px solid #b8c0bf; background: #f0f1f1; }
.settings-tree strong { margin: 8px 6px 4px; color: #303b3d; font-size: 12px; }
.settings-tree button { border: 0; padding: 5px 9px 5px 18px; color: #273335; background: transparent; text-align: left; font-size: 12px; }
.settings-tree button:hover { background: #e1ebea; }
.settings-tree button.active { color: #fff; background: #1778b0; }
.settings-content { border: 0; border-radius: 0; padding: 18px; background: #f7f7f7; box-shadow: none; }
.settings-content h2 { margin-bottom: 14px; }
.settings-group { margin: 0 0 14px; border: 1px solid #c7cecd; padding: 13px; background: #fbfbfb; }
.settings-group legend { padding: 0 6px; color: #2c393c; font-size: 12px; font-weight: 750; }
.settings-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px 16px; }
.settings-check { display: flex; align-items: center; grid-template-columns: none; gap: 8px; margin: 5px 0; color: #2f3c3f; }
.settings-check input { width: 16px; height: 16px; }
.color-setting span { display: flex; align-items: center; gap: 8px; }
.color-setting input { width: 64px; height: 31px; border: 1px solid #abb6b5; padding: 2px; background: #fff; }
.color-setting code { color: #4b595c; font-size: 11px; }
.settings-column-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px 12px; }
.settings-column-list label { display: flex; align-items: center; gap: 6px; color: #344346; font-weight: 500; }

@media (max-width: 850px) {
  .settings-shell { grid-template-columns: 1fr; }
  .settings-tree { display: grid; grid-template-columns: repeat(2, 1fr); border-right: 0; border-bottom: 1px solid #b8c0bf; }
  .settings-tree strong { grid-column: 1 / -1; }
  .settings-grid, .settings-column-list { grid-template-columns: 1fr; }
  .classic-group-filter { display: none; }
}

/* Verwaltung: kompakte, robuste Desktopaufteilung ohne überlagernde Karten. */
.classic-admin-page { gap: 12px; max-width: 1500px; margin: 0 auto; }
.classic-admin-page .page-head { padding-bottom: 8px; border-bottom: 1px solid #b8c0bf; }
.classic-admin-page .page-head h1 { font-size: 28px; }
.classic-admin-page .page-head .lede { margin-top: 4px; }
.admin-type-tabs { display: flex; flex-wrap: wrap; gap: 0; border: 1px solid #aeb7b7; background: #eef0ef; }
.admin-type-tabs button { border: 0; border-right: 1px solid #b8c0bf; border-radius: 0; padding: 7px 10px; color: #263235; background: linear-gradient(#fff, #e8ebea); }
.admin-type-tabs button:hover { background: #e0e9e8; }
.admin-type-tabs button.active { color: #fff; background: #1c7082; }
.admin-focus-banner { padding: 7px 10px; border: 1px solid #7fa6ad; border-top: 0; color: #134a56; background: #e4f1f3; font-size: 12px; font-weight: 800; }
.admin-focus-section { scroll-margin-top: 78px; outline: 2px solid #58a0ad; outline-offset: -1px; background: #f2fbfc !important; }
.classic-admin-page .admin-grid { grid-template-columns: 300px minmax(0, 1fr); gap: 0; min-height: 560px; border: 1px solid #aeb7b7; background: #f6f6f6; }
.classic-admin-page .content-card { border: 0; border-radius: 0; box-shadow: none; }
.classic-admin-page .admin-list { max-height: 760px; overflow: auto; border-right: 1px solid #aeb7b7; background: #f1f3f2; }
.classic-admin-page .list-toolbar { position: sticky; top: 0; z-index: 2; padding: 8px 10px; background: #dfe3e2; border-bottom: 1px solid #aeb7b7; }
.classic-admin-page .list-item { min-height: 48px; padding: 7px 10px; border-bottom: 1px solid #cfd5d4; }
.classic-admin-page .list-item:hover { background: #e1ecea; }
.classic-admin-page .list-item.active { color: #fff; background: #1778b0; }
.classic-admin-page .list-item.active span { color: #e4f1f3; }
.classic-admin-page .detail-panel { min-width: 0; overflow: visible; padding: 16px 18px 24px; background: #fafafa; }
.classic-admin-page .detail-panel > p { margin: 5px 0 14px; }
.classic-admin-page .form-grid { align-items: start; gap: 10px 12px; }
.classic-admin-page label { min-width: 0; }
.holiday-import-panel { display: grid; grid-template-columns: minmax(230px, .7fr) minmax(500px, 1.3fr); gap: 10px 18px; border: 1px solid #91a9aa; border-top: 0; padding: 11px 13px; background: #eaf2f1; }
.holiday-import-copy { display: grid; align-content: center; gap: 2px; }
.holiday-import-copy > span { color: #1c7082; font-size: 9px; font-weight: 850; letter-spacing: .11em; }
.holiday-import-copy > strong { color: #18383f; font-size: 14px; }
.holiday-import-copy > small { color: #607174; font-size: 10px; }
.holiday-import-form { display: grid; grid-template-columns: 110px minmax(230px, 1fr) auto; align-items: end; gap: 8px; }
.holiday-import-form .button { min-height: 35px; white-space: nowrap; }
.holiday-import-preview, .holiday-import-error { grid-column: 1 / -1; }
.holiday-import-preview { display: grid; grid-template-columns: minmax(250px, 1fr) auto; align-items: end; gap: 8px 12px; border-top: 1px solid #b9c9c7; padding-top: 9px; }
.holiday-import-summary { display: flex; align-items: baseline; gap: 10px; }
.holiday-import-summary strong { font-size: 12px; }
.holiday-import-summary span { color: #607174; font-size: 10px; }
.holiday-import-list { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); max-height: 116px; overflow: auto; border: 1px solid #c5d1cf; background: #fff; }
.holiday-import-list > div { display: grid; grid-template-columns: 72px minmax(0, 1fr) auto; gap: 6px; padding: 5px 7px; border-right: 1px solid #e0e6e4; border-bottom: 1px solid #e0e6e4; font-size: 10px; }
.holiday-import-list time { color: #41565b; font-variant-numeric: tabular-nums; }
.holiday-import-list small { color: #23705e; font-size: 9px; font-weight: 750; }
.holiday-import-list .existing { color: #7b8587; background: #f2f3f2; }
.holiday-import-list .existing small { color: #7b8587; }
.holiday-import-error { border-left: 3px solid #bb4238; padding: 7px 9px; color: #8d302b; background: #fff2f0; font-size: 11px; }
@media (max-width: 980px) {
  .holiday-import-panel { grid-template-columns: 1fr; }
  .holiday-import-form { grid-template-columns: 100px minmax(190px, 1fr) auto; }
}
@media (max-width: 620px) {
  .holiday-import-form { grid-template-columns: 1fr; }
  .holiday-import-preview { grid-template-columns: 1fr; }
}
.classic-admin-page .text-input, .classic-admin-page .select, .classic-admin-page .textarea { min-width: 0; border-radius: 1px; padding: 7px 8px; }
.classic-admin-page .form-actions { padding-top: 12px; border-top: 1px solid #d0d6d5; }
.classic-admin-page .restriction-fields, .classic-admin-page .inline-form { border-radius: 0; background: #f0f2f1; }
.classic-admin-page .employee-planning-fields { min-width: 0; }
.classic-admin-page .employee-planning-fields section { min-width: 0; overflow-x: auto; }
.classic-admin-page .compact-table { min-width: 620px; }
.classic-admin-page .user-rights-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

@media (max-width: 1000px) {
  .classic-admin-page .admin-grid { grid-template-columns: 240px minmax(0, 1fr); }
  .classic-admin-page .form-grid { grid-template-columns: 1fr; }
  .classic-admin-page .form-grid .full { grid-column: auto; }
}

/* Desktopfenster: Einstellungen und Betriebsorganisation bleiben über dem DP. */
.modal-backdrop { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 22px; background: rgb(15 25 28 / 24%); }
.desktop-modal { display: grid; grid-template-rows: auto minmax(0, 1fr); width: min(1420px, calc(100vw - 44px)); max-height: calc(100vh - 44px); border: 1px solid #7e898a; border-radius: 3px; color: #18282c; background: #f4f4f4; box-shadow: 0 18px 70px rgb(0 0 0 / 32%); overflow: hidden; }
.settings-modal { width: min(1180px, calc(100vw - 44px)); }
.requirements-modal { width: min(1040px, calc(100vw - 44px)); }
.employee-manager-modal { width: min(760px, calc(100vw - 44px)); }
.modal-titlebar { display: flex; align-items: center; justify-content: space-between; min-height: 34px; padding: 5px 8px 5px 12px; border-bottom: 1px solid #aab2b3; color: #15272b; background: linear-gradient(#fafafa, #e5e8e8); font-size: 13px; }
.modal-titlebar button { display: grid; place-items: center; width: 28px; height: 24px; border: 0; color: #39484b; background: transparent; font-size: 22px; line-height: 1; }
.modal-titlebar button:hover { color: #fff; background: #c42b1c; }
.modal-body { min-height: 0; overflow: auto; }
.desktop-modal .page { max-width: none; margin: 0; padding: 12px; }
.desktop-modal .button, .desktop-modal .text-input, .desktop-modal .select, .desktop-modal .textarea { border-radius: 2px; }
.desktop-modal .classic-admin-page .page-head { align-items: center; }
.desktop-modal .classic-admin-page .page-head h1 { display: none; }
.desktop-modal .classic-admin-page .eyebrow, .desktop-modal .classic-admin-page .lede { display: none; }
.modal-intro { margin: 0 0 8px; color: #536165; font-size: 12px; }
.settings-modal .settings-shell { min-height: 0; height: min(650px, calc(100vh - 125px)); box-shadow: none; }
.settings-modal .settings-content { overflow: auto; }
.window-actions { display: flex; justify-content: flex-end; gap: 8px; padding-top: 10px; border-top: 1px solid #c4cbcb; }

/* Mitarbeiterverwaltung wie im Original: Gruppenbaum, Liste und ein zweites Bearbeitungsfenster. */
.employee-manager-page { gap: 10px !important; min-height: 450px; }
.manager-columns { display: grid; grid-template-columns: .9fr 1.1fr; gap: 12px; min-height: 390px; }
.manager-pane { display: grid; grid-template-rows: minmax(0, 1fr) auto; min-width: 0; margin: 0; border: 1px solid #c0c7c7; padding: 10px; background: #f8f8f8; }
.manager-pane legend { padding: 0 5px; font-size: 12px; }
.manager-tree, .manager-employees { overflow: auto; border: 1px solid #9da9aa; background: #fff; }
.manager-employee-list { display: grid; grid-template-rows: auto minmax(0, 1fr); min-height: 0; }
.manager-tree-row, .manager-employee-row { display: flex; align-items: center; gap: 5px; width: 100%; min-height: 27px; border: 0; padding: 4px 7px; color: #17262a; background: transparent; text-align: left; font-size: 12px; }
.manager-tree-row:not(.root) { padding-left: 26px; }
.manager-tree-row.active, .manager-employee-row.active { color: #fff; background: #1678bb; }
.manager-employee-head, .manager-employee-row { display: grid; grid-template-columns: minmax(0, 1fr) 84px; gap: 8px; }
.manager-employee-head { padding: 5px 7px; border: 1px solid #9da9aa; border-bottom: 0; background: #f4f5f5; font-size: 11px; font-weight: 700; }
.manager-employee-row small { color: inherit; font-size: 11px; }
.manager-buttons { display: flex; flex-wrap: wrap; gap: 7px; padding-top: 10px; }
.nested-modal-backdrop { position: fixed; inset: 0; z-index: 120; display: grid; place-items: center; padding: 18px; background: rgb(12 20 23 / 22%); }
.nested-modal { display: grid; grid-template-rows: auto minmax(0, 1fr); width: min(1120px, calc(100vw - 36px)); max-height: calc(100vh - 36px); border: 1px solid #737f80; border-radius: 3px; background: #f5f5f5; box-shadow: 0 18px 70px rgb(0 0 0 / 36%); overflow: hidden; }
.nested-modal-body { min-height: 0; overflow: auto; padding: 14px; }
.nested-modal .detail-panel { padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.nested-modal-body > h2, .nested-modal-body > p { display: none; }

/* Mitarbeiterbedarf: Originalmatrix Mo–So plus separatem Feiertag. */
.requirements-page { gap: 10px !important; }
.requirements-shell { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: 12px; min-height: 390px; }
.requirements-groups fieldset { height: 100%; margin: 0; border: 1px solid #bdc5c5; padding: 9px; background: #f8f8f8; }
.requirements-groups legend { padding: 0 5px; font-size: 12px; }
.requirement-group { display: flex; align-items: center; gap: 5px; width: 100%; min-height: 28px; border: 0; padding: 4px 7px; color: #17272b; background: transparent; text-align: left; font-size: 12px; }
.requirement-group:not(:first-child) { padding-left: 24px; }
.requirement-group.active { color: #fff; background: #1678bb; }
.requirements-editor { min-width: 0; }
.requirement-toolbar { display: grid; grid-template-columns: 170px 90px auto auto minmax(100px, 1fr); align-items: end; gap: 8px; margin-bottom: 10px; }
.selection-status { align-self: center; justify-self: end; color: #536266; font-size: 11px; }
.requirement-table-wrap { overflow: auto; border: 1px solid #9da8a9; background: #fff; }
.requirements-table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.requirements-table th, .requirements-table td { height: 43px; border-right: 1px solid #c3caca; border-bottom: 1px solid #c3caca; padding: 0; text-align: center; }
.requirements-table thead th { height: 32px; background: #e9ecec; }
.requirements-table thead th:first-child, .requirements-table tbody th { width: 245px; text-align: left; }
.requirements-table thead button { width: 100%; height: 100%; border: 0; color: #1e2d30; background: transparent; font-size: 12px; font-weight: 750; }
.requirements-table thead button:hover { background: #d6e5e5; }
.requirement-shift { display: flex; align-items: center; gap: 8px; width: 100%; height: 100%; border: 0; padding: 5px 8px; color: #1c2b2e; background: #f5f6f6; text-align: left; }
.requirement-shift i { flex: 0 0 auto; width: 13px; height: 28px; border: 1px solid rgb(0 0 0 / 12%); }
.requirement-shift span, .requirement-shift strong, .requirement-shift small { display: block; }
.requirement-shift small { margin-top: 2px; color: #607073; font-size: 10px; }
.requirement-shift:hover { background: #e1eeee; }
.requirement-cell { display: grid; place-items: center; width: 100%; height: 100%; border: 0; color: #16272a; background: #fff; }
.requirement-cell:hover { background: #eaf4f3; box-shadow: inset 0 0 0 2px #6d9fa4; }
.requirement-cell.selected { color: #fff; background: #1678bb; box-shadow: inset 0 0 0 2px #0d5f95; }
.requirement-cell strong { font-size: 14px; }
.requirement-cell small { font-size: 8px; font-weight: 500; }
.requirement-invalid { background: repeating-linear-gradient(-45deg, #e1e3e3 0 5px, #d9dcdc 5px 10px); }
.requirement-hint { margin: 8px 0 0; }

/* Originalnahes Kontextmenü für die schnelle Dienstplanpflege. */
.plan-context-menu,
.context-submenu-panel {
  position: fixed; z-index: 260; min-width: 235px; border: 1px solid #c8c8c8; padding: 4px 0; color: #171717;
  background: #fafafa; box-shadow: 0 5px 16px rgb(0 0 0 / 20%); font: 12px "Segoe UI", Arial, sans-serif;
}
.plan-context-menu > button,
.context-submenu-trigger,
.context-submenu-panel button {
  display: flex; align-items: center; gap: 8px; width: 100%; min-height: 29px; border: 0; padding: 5px 12px 5px 36px;
  color: inherit; background: transparent; text-align: left; white-space: nowrap;
}
.plan-context-menu button:hover:not(:disabled), .plan-context-menu button:focus-visible { background: #dcebf5; outline: 0; }
.context-separator { display: block; height: 1px; margin: 3px 7px 3px 31px; background: #d5d5d5; }
.context-submenu { position: relative; display: block; }
.context-submenu-trigger b { margin-left: auto; font-size: 18px; font-weight: 400; line-height: 1; }
.context-submenu-panel { position: absolute; top: -5px; left: calc(100% - 4px); display: none; max-height: min(430px, 80vh); overflow: auto; }
.context-submenu:hover > .context-submenu-panel, .context-submenu:focus-within > .context-submenu-panel { display: block; }
.plan-context-menu.open-left .context-submenu-panel { right: calc(100% - 4px); left: auto; }
.context-submenu-panel button { padding-left: 10px; }
.context-submenu-panel button i { flex: 0 0 auto; width: 15px; height: 15px; border: 1px solid rgb(0 0 0 / 18%); }
.context-submenu-panel button span { flex: 1 1 auto; }
.context-submenu-panel button small { color: #a22921; }
.context-submenu-panel button:disabled { color: #929797; background: #f1f1f1; }
.context-empty { display: block; padding: 8px 12px; color: #747b7c; }
.context-danger { color: #a72820 !important; }

/* Mehrere Teildienste bleiben kompakt in einem Tagesfeld. */
.classic-plan .entry-stack { display: grid; grid-auto-rows: minmax(8px, 1fr); width: 100%; height: 24px; overflow: hidden; }
.classic-plan .entry.compact-entry { min-height: 0; height: auto; padding: 0 2px 2px; font-size: 8px; line-height: 1; }
.classic-plan .entry.compact-entry::after { height: 2px; }
.classic-plan .entry-stack .comment-indicator { display: grid; place-items: center; padding: 0; }
.day-entry-row { margin: 0 0 12px; border: 1px solid #bfc8c8; border-left: 7px solid var(--entry-color); padding: 10px; background: #f7f8f8; }
.day-entry-row legend { padding: 0 5px; font-size: 12px; font-weight: 800; }
.day-entry-grid { display: grid; grid-template-columns: repeat(4, minmax(110px, 1fr)); align-items: end; gap: 9px; }
.day-entry-note { grid-column: 1 / -1; }
.day-entry-note textarea { min-height: 48px; }
.day-entry-remove { display: flex; align-items: center; grid-column: 1 / -1; gap: 7px; color: #a12820; }

/* Mehrfachzuordnung von Mitarbeitern und Diensten zu Gruppen. */
.group-membership, .shift-coverage { margin: 4px 0; border: 1px solid #c4cccc; padding: 10px; background: #f5f7f6; }
.group-membership legend, .shift-coverage legend { padding: 0 5px; color: #26383b; font-size: 12px; font-weight: 800; }
.group-membership > div, .shift-coverage > div { display: flex; flex-wrap: wrap; gap: 8px 18px; }
.group-membership label, .shift-coverage label { display: flex; align-items: center; gap: 6px; min-width: 150px; font-weight: 600; }
.group-membership p, .shift-coverage p { margin: 8px 0 0; color: #5b696b; font-size: 11px; font-weight: 400; }
.shift-coverage { background: #eef6f8; }
.shift-coverage label { min-width: 220px; }
.contract-days { margin: 4px 0; border: 1px solid #c4cccc; padding: 10px; background: #f5f7f6; }
.contract-days legend { padding: 0 5px; color: #26383b; font-size: 12px; font-weight: 800; }
.contract-days > div { display: flex; flex-wrap: wrap; gap: 8px 16px; }
.contract-days label { display: flex; align-items: center; gap: 5px; min-width: 58px; }
.contract-days p { margin: 8px 0 0; color: #5b696b; font-size: 11px; font-weight: 400; }

@media (max-width: 760px) {
  .modal-backdrop { padding: 6px; }
  .desktop-modal { width: calc(100vw - 12px); max-height: calc(100vh - 12px); }
  .manager-columns, .requirements-shell { grid-template-columns: 1fr; }
  .manager-columns { min-height: 650px; }
  .requirement-toolbar { grid-template-columns: 1fr 1fr; }
  .selection-status { justify-self: start; }
  .day-entry-grid { grid-template-columns: 1fr 1fr; }
}

/* Abschließende Priorität für Tag/Nacht/Auto nach den klassischen Regeln. */
:root[data-theme="dark"] .classic-header,
:root[data-theme="dark"] .classic-commandbar,
:root[data-theme="dark"] .classic-menubar,
:root[data-theme="dark"] .desktop-modal,
:root[data-theme="dark"] .modal-titlebar,
:root[data-theme="dark"] .classic-admin-page .detail-panel,
:root[data-theme="dark"] .classic-admin-page .manager-pane,
:root[data-theme="dark"] .classic-admin-page .requirement-shift,
:root[data-theme="dark"] .classic-admin-page .requirement-cell,
:root[data-theme="dark"] .classic-admin-page .requirements-table thead th,
:root[data-theme="dark"] .classic-admin-page .list-item,
:root[data-theme="dark"] .report-settings,
:root[data-theme="dark"] .report-menu,
:root[data-theme="dark"] .report-preview-toolbar { color: var(--ink) !important; background: #222b2e !important; border-color: var(--line) !important; }

@media (prefers-color-scheme: dark) {
  :root[data-theme="auto"] .classic-header,
  :root[data-theme="auto"] .classic-commandbar,
  :root[data-theme="auto"] .classic-menubar,
  :root[data-theme="auto"] .desktop-modal,
  :root[data-theme="auto"] .modal-titlebar,
  :root[data-theme="auto"] .classic-admin-page .detail-panel,
  :root[data-theme="auto"] .classic-admin-page .manager-pane,
  :root[data-theme="auto"] .classic-admin-page .requirement-shift,
  :root[data-theme="auto"] .classic-admin-page .requirement-cell,
  :root[data-theme="auto"] .classic-admin-page .requirements-table thead th,
  :root[data-theme="auto"] .classic-admin-page .list-item,
  :root[data-theme="auto"] .report-settings,
  :root[data-theme="auto"] .report-menu,
  :root[data-theme="auto"] .report-preview-toolbar { color: var(--ink) !important; background: #222b2e !important; border-color: var(--line) !important; }
}