:root {
  color: #243746;
  background: #f8fbfd;
  font-family: Arial, sans-serif;
  --background: #f8fbfd;
  --surface: #ffffff;
  --sidebar: #f0f7fb;
  --text: #243746;
  --muted: #607684;
  --primary: #2f89b5;
  --primary-hover: #1f6f96;
  --primary-soft: #d6ecf8;
  --hover-soft: #e6f3f9;
  --border: #d8e7ef;
  --focus: rgb(47 137 181 / 28%);
  --success: #287a55;
  --success-soft: #e5f5ed;
  --warning: #95620b;
  --warning-soft: #fff5d9;
  --danger: #b04444;
  --danger-hover: #913535;
  --danger-soft: #fceaea;
  --info: #276f94;
  --info-soft: #e6f3fa;
  --on-primary: #fff;
  --input-border: #9eb4c1;
  --input-invalid: #fffafa;
  --input-disabled: #eef3f6;
  --table-heading: #355267;
  --table-heading-background: #f0f7fb;
  --sidebar-text: #496777;
  --overlay: rgb(36 55 70 / 32%);
  --page-header-background: rgb(248 251 253 / 95%);
  --shadow: 0 6px 20px rgb(36 55 70 / 7%);
  --shadow-hover: 0 10px 24px rgb(36 55 70 / 10%);
  --radius: 12px;
  --radius-control: 9px;
  --speed: 200ms;
  --sidebar-width: 264px;
  --sidebar-collapsed-width: 72px;
  --z-sidebar: 30;
  --z-backdrop: 40;
  --z-mobile-sidebar: 50;
  --z-dialog: 60;
  --z-toast: 80;
  --z-loading: 100;
}

* { box-sizing: border-box; }
html { color-scheme: light; }
html[data-theme="dark"] { color-scheme: dark; }
html[data-theme="dark"] {
  --background: #0f172a; --surface: #111827; --sidebar: #162033; --text: #e5e7eb; --muted: #94a3b8;
  --primary: #38bdf8; --primary-hover: #7dd3fc; --primary-soft: #153b58; --hover-soft: #1e3a52; --border: #334155;
  --focus: rgb(56 189 248 / 32%); --success: #4ade80; --success-soft: #153b2a; --warning: #fbbf24; --warning-soft: #493713;
  --danger: #f87171; --danger-hover: #fca5a5; --danger-soft: #4a2024; --info: #67c9f5; --info-soft: #153b58;
  --input-border: #475569; --input-invalid: #3b1f25; --input-disabled: #1f2937; --table-heading: #dbeafe; --table-heading-background: #1e293b;
  --sidebar-text: #cbd5e1; --overlay: rgb(2 6 23 / 68%); --page-header-background: rgb(15 23 42 / 95%);
  --shadow: 0 6px 20px rgb(0 0 0 / 28%); --shadow-hover: 0 10px 24px rgb(0 0 0 / 40%);
}
html[data-theme="sky"] { --background: #f3faff; --surface: #fff; --sidebar: #e8f5ff; --text: #17364b; --muted: #527084; --primary: #1677b8; --primary-hover: #105c92; --primary-soft: #d5efff; --hover-soft: #e5f5ff; --border: #b9dced; --focus: rgb(22 119 184 / 28%); }
html[data-theme="green"] { --background: #f5faf6; --surface: #fff; --sidebar: #edf7ef; --text: #203c2b; --muted: #587363; --primary: #32845a; --primary-hover: #256943; --primary-soft: #dcefe2; --hover-soft: #eaf6ed; --border: #c4dfcd; --focus: rgb(50 132 90 / 28%); }
html[data-theme="purple"] { --background: #faf8ff; --surface: #fff; --sidebar: #f2edff; --text: #36294c; --muted: #6d607f; --primary: #7654ba; --primary-hover: #5c3d99; --primary-soft: #e7ddff; --hover-soft: #f0eaff; --border: #d9ccef; --focus: rgb(118 84 186 / 28%); }
html[data-theme="amber"] { --background: #fffbf3; --surface: #fffefa; --sidebar: #fff4dc; --text: #4a3821; --muted: #79664c; --primary: #b46c17; --primary-hover: #8f5310; --primary-soft: #ffebbf; --hover-soft: #fff4dc; --border: #ebd3a8; --focus: rgb(180 108 23 / 28%); }
html[data-theme="gray"] { --background: #f7f8fa; --surface: #fff; --sidebar: #eff1f4; --text: #303841; --muted: #65707c; --primary: #52687c; --primary-hover: #3d5265; --primary-soft: #dfe7ed; --hover-soft: #edf1f4; --border: #cfd8df; --focus: rgb(82 104 124 / 28%); }
body { min-height: 100vh; margin: 0; color: var(--text); background: var(--background); line-height: 1.5; }
h1 { margin: 4px 0 24px; color: var(--text); font-size: 26px; letter-spacing: 0; }
h2 { margin: 0; color: var(--text); font-size: 18px; letter-spacing: 0; }
p { overflow-wrap: anywhere; }
.page-shell { max-width: 1100px; margin: 0 auto; padding: 32px 16px; }
.eyebrow { margin: 0; color: var(--primary-hover); font-weight: 700; }
.forms-header, .entry-header, .admin-header { margin-bottom: 22px; }
.entry-header > p:last-child { color: var(--muted); }
.profile-page-header { position: sticky; z-index: 20; top: 0; display: flex; align-items: center; justify-content: space-between; gap: 20px; margin: -12px 0 22px; padding: 16px 0; border-bottom: 1px solid var(--border); background: var(--page-header-background); backdrop-filter: blur(8px); }
.profile-page-header h1 { margin-bottom: 8px; }
.profile-page-header p:last-child { margin: 0; color: var(--muted); }
.profile-save-button { position: relative; z-index: 1; flex: none; width: auto; min-width: 230px; margin: 0; }

label { display: block; margin: 18px 0 7px; font-weight: 700; }
input, select, textarea, button, .button-link { min-height: 46px; font: inherit; border-radius: var(--radius-control); }
input, select, textarea { width: 100%; border: 1px solid var(--input-border); color: var(--text); background: var(--surface); padding: 10px 12px; transition: border-color var(--speed), box-shadow var(--speed); }
textarea { resize: vertical; }
.bm07-detail-form textarea { min-height: 150px; line-height: 1.5; }
.bm07-detail-form #subject { min-height: 88px; }
.bm07-recommendation-section { margin-top: 32px; padding-top: 8px; border-top: 1px solid var(--border); }
input:focus, select:focus, textarea:focus { border-color: var(--primary); outline: 0; box-shadow: 0 0 0 3px var(--focus); }
input[aria-invalid="true"], select[aria-invalid="true"], textarea[aria-invalid="true"] { border-color: var(--danger); background: var(--input-invalid); }
input:disabled, select:disabled, textarea:disabled, input[readonly] { color: var(--muted); background: var(--input-disabled); cursor: not-allowed; }
input[type="checkbox"] { width: 20px; min-height: 20px; accent-color: var(--primary); }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, canvas:focus-visible { outline: 3px solid var(--primary); outline-offset: 2px; }

button, .button-link { display: inline-flex; width: 100%; align-items: center; justify-content: center; margin-top: 24px; padding: 10px 16px; border: 1px solid var(--primary); color: var(--on-primary); background: var(--primary); font-weight: 700; text-decoration: none; cursor: pointer; transition: background var(--speed), border-color var(--speed), box-shadow var(--speed), transform var(--speed); }
button:hover, .button-link:hover { border-color: var(--primary-hover); background: var(--primary-hover); box-shadow: 0 4px 12px rgb(47 137 181 / 18%); transform: translateY(-1px); }
button:disabled, .button-link[aria-disabled="true"] { opacity: .58; cursor: not-allowed; box-shadow: none; transform: none; }
.button-secondary, .secondary-button { color: var(--primary-hover); border-color: var(--border); background: var(--surface); box-shadow: none; }
.button-secondary:hover, .secondary-button:hover { color: var(--primary-hover); border-color: var(--primary); background: var(--hover-soft); box-shadow: none; }
.button-danger { border-color: var(--danger); background: var(--danger); }
.button-danger:hover { border-color: var(--danger-hover); background: var(--danger-hover); }
.text-link, .user-actions a { color: var(--primary-hover); font-weight: 700; }
.text-link { display: inline-block; margin-top: 16px; }

.auth-panel, .error-panel, .form-entry, .preview-sheet, .user-card, .form-card, .search-form { border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow); }
.auth-panel, .error-panel { max-width: 620px; padding: 28px; }
body:not(:has(.application-sidebar)) .auth-panel, body:not(:has(.application-sidebar)) .error-panel { margin: clamp(24px, 8vh, 72px) auto 0; }
.login-shell { position: relative; max-width: 624px; margin: clamp(24px, 8vh, 72px) auto 0; padding: 2px; overflow: hidden; border-radius: calc(var(--radius) + 2px); background: #b8e1f2; box-shadow: var(--shadow); }
.login-shell::before { position: absolute; z-index: 0; inset: -50%; background: conic-gradient(from 0deg, #b8e1f2, #d9d3f5, #f8d2e0, #b8e1f2); animation: login-border-spin 14s linear infinite; content: ""; pointer-events: none; }
body:not(:has(.application-sidebar)) .login-shell .auth-panel { position: relative; z-index: 1; max-width: none; margin: 0; border: 0; box-shadow: none; }
.login-footer { margin: 14px auto 0; color: var(--muted); font-size: 13px; text-align: center; }
body.login-page { min-height: 100vh; background-color: #102a40; background-image: linear-gradient(rgb(8 24 40 / 45%), rgb(8 24 40 / 45%)), url("/static/assets/wallpaper.webp"); background-position: center center; background-size: cover; background-repeat: no-repeat; background-attachment: fixed; }
body.login-page .page-shell { min-height: calc(100vh - 44px); padding-inline: 16px; }
body.login-page .login-shell { background: #b8e1f2; box-shadow: 0 12px 32px rgb(4 20 33 / 34%); }
body.login-page .login-shell .auth-panel { background-color: rgb(255 255 255 / 96%); }
@supports (backdrop-filter: blur(1px)) { body.login-page .login-shell .auth-panel { background-color: rgb(255 255 255 / 92%); backdrop-filter: blur(8px); } }
body.login-page .login-footer { color: #f7fbff; font-weight: 700; text-shadow: 0 1px 3px rgb(4 20 33 / 64%); }
.nyan-cat-runner { position: fixed; z-index: 25; top: 12px; left: 0; width: clamp(110px, 9vw, 140px); height: 0; pointer-events: none; transform: translate3d(calc(-100% - 40px), 0, 0); filter: drop-shadow(0 3px 4px rgb(0 0 0 / 25%)); }
.nyan-cat-runner--active { animation: nyanCatFly 8s linear 1; will-change: transform; }
.nyan-cat-runner img { display: block; width: 100%; height: auto; user-select: none; pointer-events: none; }
.form-entry, .preview-sheet { padding: 20px; }
.maintenance-banner { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin: 0 0 22px; padding: 12px 14px; border: 1px solid var(--warning); border-left-width: 5px; border-radius: var(--radius-control); color: var(--warning); background: var(--warning-soft); font-weight: 700; box-shadow: var(--shadow); }
.maintenance-banner form { flex: none; margin: 0; }.maintenance-banner button { width: auto; min-height: 40px; margin: 0; }.maintenance-audit ul { margin: 14px 0 0; padding-left: 20px; }.maintenance-audit li + li { margin-top: 8px; }
.history-list { display: grid; gap: 12px; }
.history-table-wrap { display: none; max-width: 100%; overflow-x: auto; border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow); }.history-table { width: 100%; border-collapse: collapse; font-size: 14px; }.history-table th, .history-table td { padding: 12px; border-bottom: 1px solid var(--border); text-align: left; vertical-align: top; }.history-table th { color: var(--table-heading); background: var(--table-heading-background); white-space: nowrap; }.history-table th:first-child, .history-table td:first-child { width: 44px; text-align: center; }.history-table td:last-child { min-width: 260px; }.history-mobile-list { display: grid; gap: 12px; }
.history-card { display: flex; min-width: 0; align-items: center; justify-content: space-between; gap: 20px; padding: 18px 20px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow); }
.history-card-main { min-width: 0; }.history-card h2 { overflow-wrap: anywhere; }.history-code, .history-meta, .history-owner, .history-unavailable { margin: 4px 0; }.history-code { color: var(--primary-hover); font-weight: 800; }.history-meta, .history-owner { color: var(--muted); font-size: 14px; }.history-unavailable { color: var(--warning); font-size: 13px; }.history-badges { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.history-actions { display: flex; flex: none; flex-wrap: wrap; align-items: center; gap: 8px; }.history-actions form { margin: 0; }.history-action { display: inline-flex; min-height: 44px; align-items: center; justify-content: center; padding: 8px 12px; border: 1px solid var(--border); border-radius: var(--radius-control); color: var(--primary-hover); background: var(--surface); font-weight: 700; text-decoration: none; white-space: nowrap; }.history-action:hover { border-color: var(--primary); background: var(--hover-soft); }.history-actions button { width: auto; margin: 0; }.history-action-view { border-color: var(--primary); background: var(--primary); color: var(--on-primary); }.history-action-view:hover { background: var(--primary-hover); color: var(--on-primary); }.history-detail { color: var(--muted); }.history-filter { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 180px) auto; gap: 12px; align-items: end; }.history-filter label { margin-top: 0; }.history-filter button { width: auto; margin: 0; }.history-pagination { display: flex; align-items: center; justify-content: center; gap: 12px; margin-top: 20px; }.history-pagination a { min-height: 44px; padding: 10px 14px; border: 1px solid var(--border); border-radius: var(--radius-control); color: var(--primary-hover); font-weight: 700; text-decoration: none; }
.history-bulk-toolbar { position: sticky; z-index: 5; top: 8px; display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 0 0 12px; padding: 10px 12px; border: 1px solid var(--border); border-radius: var(--radius-control); background: var(--surface); box-shadow: var(--shadow); }.history-bulk-toolbar button { width: auto; min-height: 44px; margin: 0; }.history-select-card { display: inline-flex; align-items: center; gap: 6px; margin-bottom: 8px; font-size: 14px; }.history-delete { color: var(--danger); border-color: #df9c9c; }
.narrow-card { max-width: 620px; }
.search-form { margin-bottom: 20px; padding: 18px; }
.search-form > label { margin-top: 0; }
.search-row { display: grid; gap: 8px; grid-template-columns: 1fr auto; }
.search-row button { width: auto; margin: 0; padding-inline: 18px; }
.field-help, .signature-warning { color: var(--muted); font-size: 14px; }
.required-marker, .field-error, .row-feedback { color: var(--danger); }
.field-error { margin: 5px 0 0; font-size: 12px; font-weight: 700; }
.row-feedback { margin: 8px 0 0; font-size: 14px; font-weight: 700; }
.workflow-assignment-section { display: grid; gap: 12px; margin-top: 28px; padding: 18px; border: 1px solid var(--border); border-left: 4px solid var(--primary); border-radius: var(--radius-control); background: var(--hover-soft); }
.workflow-assignment-section h2, .workflow-assignment-section p { margin: 0; }
.workflow-assignment-list { display: grid; gap: 14px; }
.workflow-assignment-control { display: grid; gap: 6px; }
.workflow-assignment-control select { min-height: 44px; }

.form-catalogue, .user-list { display: grid; gap: 14px; }
.form-card { display: grid; min-height: 180px; gap: 5px; padding: 22px; color: var(--text); text-decoration: none; transition: transform var(--speed), box-shadow var(--speed), border-color var(--speed); }
.form-card:hover, .form-card:focus-visible { border-color: #acd2e5; box-shadow: var(--shadow-hover); transform: translateY(-2px); }
.form-card > span { color: var(--primary-hover); font-size: 13px; font-weight: 800; }
.form-card strong { font-size: 18px; }
.form-card p { margin: 6px 0; color: var(--muted); }
.form-card small { margin-top: auto; color: var(--primary-hover); font-weight: 700; }
.form-section--accounting { margin-top: 32px; padding: clamp(18px, 4vw, 30px); border: 1px solid #c8ddd1; border-left: 5px solid #4d8c68; border-radius: calc(var(--radius) + 2px); background: #f1f8f3; box-shadow: var(--shadow); }
.accounting-section-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; margin-bottom: 18px; }
.accounting-section-heading h2 { margin-top: 2px; font-size: 22px; }.accounting-section-heading p:last-child { margin-bottom: 0; color: #486454; }
.form-badges { display: flex; flex-wrap: wrap; gap: 6px; }.badge-accounting { color: #245b3b; background: #dcefe2; border: 1px solid #b8d8c2; }.form-card--accounting { border-color: #c8ddd1; background: #fff; }.form-card--accounting:hover, .form-card--accounting:focus-visible { border-color: #4d8c68; }.form-card--accounting > .form-code, .form-card--accounting small { color: #286543; }.accounting-entry-header { padding: 18px; border-left: 4px solid #4d8c68; border-radius: var(--radius-control); background: #f1f8f3; }.accounting-entry-header h1 { margin-bottom: 12px; }.accounting-signature-copy { margin-top: 28px; padding: 16px; border-radius: var(--radius-control); background: #f1f8f3; border: 1px solid #c8ddd1; }.accounting-signature-copy p { margin: 8px 0 0; color: #486454; }

.desktop-user-table-wrap { display: none; overflow-x: auto; border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow); }
.desktop-user-table, .entry-table { width: 100%; border-collapse: collapse; background: var(--surface); font-size: 14px; }
.desktop-user-table th, .desktop-user-table td, .entry-table th, .entry-table td { padding: 12px; border: 1px solid var(--border); text-align: left; vertical-align: top; }
.desktop-user-table th, .entry-table th { color: var(--table-heading); background: var(--table-heading-background); white-space: nowrap; }
.entry-table { min-width: 620px; }
.assignment-permission-filters { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); align-items: end; margin-bottom: 18px; }.assignment-selection-toolbar { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 14px 0; }.assignment-selection-toolbar strong { margin-right: auto; }.assignment-candidate-list { display: grid; gap: 8px; max-height: 420px; overflow-y: auto; border: 1px solid var(--border); border-radius: var(--radius-control); padding: 10px; }.assignment-candidate { display: flex; align-items: center; gap: 10px; padding: 10px; border: 1px solid var(--border); border-radius: var(--radius-control); cursor: pointer; }.assignment-candidate em { margin-left: auto; color: var(--muted); font-size: 13px; }.assignment-permission-table-wrap { overflow-x: auto; }.assignment-permission-table td:last-child { display: flex; flex-wrap: wrap; gap: 6px; min-width: 155px; }.assignment-permission-table td:last-child form { margin: 0; }.assignment-permission-cards { display: none; }.assignment-permission-card { border: 1px solid var(--border); border-radius: var(--radius); padding: 16px; background: var(--surface); margin-top: 12px; }.assignment-permission-card p { margin: 10px 0; }.assignment-permission-card > div { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }.assignment-permission-card form { margin: 0; }
.entry-table input { min-width: 100px; min-height: 38px; padding: 6px; }
.entry-table output { display: block; min-width: 100px; font-weight: 700; }
.entry-table tfoot { color: #284c60; background: var(--primary-soft); font-weight: 800; }
.repeater-section { margin-top: 24px; overflow-x: auto; }
.user-card { padding: 18px; }
.user-card > p { margin: 5px 0 14px; color: var(--muted); }
.user-card dl { display: grid; gap: 8px; margin: 0; font-size: 14px; }
.user-card dl div { display: grid; grid-template-columns: 116px 1fr; gap: 8px; }
.user-card dt, .preview-fields dt { color: var(--muted); }
.user-card dd { margin: 0; }
.user-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 18px; }
.badge { display: inline-block; padding: 3px 8px; border-radius: 999px; font-size: 12px; font-weight: 700; }
.badge-admin { color: #28607c; background: #ddecf5; }
.badge-user { color: #506774; background: #eaf0f3; }
.badge-active { color: var(--success); background: var(--success-soft); }
.badge-inactive { color: var(--danger); background: var(--danger-soft); }

.secondary-button, .icon-button { width: auto; min-height: 38px; margin: 10px 0 0; }
.icon-button { min-width: 38px; margin: 0; padding: 4px 10px; }
.signature-panel { margin-top: 28px; border-top: 1px solid var(--border); padding-top: 20px; }
.signature-panel canvas { position: relative; z-index: 1; display: block; width: 100%; min-width: 1px; height: 180px; min-height: 180px; border: 1px solid #9eb4c1; border-radius: var(--radius-control); background: var(--surface); touch-action: none; pointer-events: auto; }
.signature-panel canvas[hidden], [data-profile-preview-frame][hidden], [data-profile-upload-frame][hidden], [data-form-signature-preview][hidden], [data-form-upload-preview][hidden], [data-profile-consent-wrap][hidden], [data-profile-upload-status][hidden], [data-profile-signature-processing][hidden], [data-form-signature-processing][hidden] { display: none; }
.form-signature-preview, .signature-profile-preview { display: flex; width: min(100%, 420px); min-height: 160px; align-items: center; justify-content: center; margin: 12px auto; padding: 16px; overflow: hidden; border: 1px solid var(--border); border-radius: var(--radius-control); background: var(--surface); }
.signature-profile-preview-wrap { position: relative; width: min(100%, 420px); margin: 12px auto; }
.signature-profile-preview-wrap .signature-profile-preview { width: 100%; margin: 0; }
.form-signature-preview img, .signature-profile-preview img { display: block; width: auto; height: auto; max-width: 100%; max-height: 220px; object-fit: contain; }
.form-signature-preview img[hidden], .signature-profile-preview img[hidden] { display: none; }
.signature-upload-preview { display: flex; }
.signature-confirm-dialog { width: min(640px, calc(100vw - 32px)); padding: 0; border: 0; border-radius: var(--radius-control); }
.signature-confirm-dialog::backdrop { background: rgb(23 42 53 / 66%); }
.signature-confirm-dialog .signature-dialog-content { grid-template-rows: auto auto auto auto; gap: 16px; padding-bottom: 18px; }
.signature-confirm-dialog .signature-dialog-header { margin: 0; }
.signature-confirm-dialog .signature-confirm, .signature-confirm-dialog .dialog-actions { margin: 0 18px; }
.signature-confirm-preview { display: flex; min-height: 180px; align-items: center; justify-content: center; margin: 0 18px; padding: 16px; overflow: hidden; border: 1px solid var(--border); border-radius: var(--radius-control); background: var(--surface); }
.signature-confirm-preview img { display: block; width: auto; height: auto; max-width: 100%; max-height: 320px; margin: 0 auto; object-fit: contain; }
.signature-confirm-preview img[hidden] { display: none; }
.signature-profile-preview p, .signature-missing p { margin: 0; }
.signature-missing { margin-top: 14px; padding: 14px; border: 1px solid #ead49d; border-radius: var(--radius-control); background: var(--warning-soft); }
.signature-missing .button-link { width: auto; min-height: 38px; margin-top: 10px; padding: 8px 12px; }
.signature-actions { display: flex; gap: 10px; }
.signature-actions .secondary-button { flex: 1; }
.workflow-primary-action { min-height: 50px; margin-top: 24px; border-color: var(--success); background: var(--success); color: #fff; font-size: 16px; font-weight: 800; }
.workflow-primary-action:hover { border-color: #1f6143; background: #1f6143; box-shadow: 0 4px 14px rgb(40 122 85 / 26%); }
.workflow-document-action { min-height: 48px; margin-top: 10px; border-color: #6250a4; background: #6250a4; color: #fff; font-weight: 800; }
.workflow-document-action:hover { border-color: #4b3b84; background: #4b3b84; color: #fff; box-shadow: 0 4px 14px rgb(98 80 164 / 24%); }
.workflow-task-section { margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--border); }
.workflow-task-section h2 { margin-bottom: 8px; }
.workflow-document-section { padding: 18px; border: 1px solid #cfc4f1; border-left: 4px solid #6250a4; border-radius: var(--radius-control); background: #f7f4ff; }
html[data-theme="dark"] .workflow-document-section { border-color: #574a86; background: #201b36; }
.workflow-reject-section { border-left: 4px solid var(--danger); padding-left: 16px; }
.workflow-status { display: inline-flex; align-items: center; width: fit-content; min-height: 26px; padding: 3px 8px; border: 1px solid transparent; border-radius: 999px; font-size: 12px; font-weight: 800; line-height: 1.3; white-space: nowrap; }
.status-pending { color: #80520a; border-color: #ecd08c; background: var(--warning-soft); }.status-viewed { color: var(--info); border-color: #a9cee2; background: var(--info-soft); }.status-signed, .status-completed { color: #1d6344; border-color: #a9d7bb; background: var(--success-soft); }.status-partially_signed { color: #5a4498; border-color: #cbbfea; background: #f0ebff; }.status-rejected, .status-cancelled { color: var(--danger); border-color: #e5b4b4; background: var(--danger-soft); }.status-preparing, .status-draft { color: var(--muted); border-color: var(--border); background: var(--input-disabled); }
.workflow-slot-list { display: grid; gap: 8px; margin: 12px 0 0; padding: 0; list-style: none; }.workflow-slot-list li { display: flex; min-width: 0; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--border); }.workflow-slot-list li:last-child { border-bottom: 0; }.workflow-slot-list span:first-child { min-width: 0; overflow-wrap: anywhere; }.workflow-slot-list small { color: var(--muted); }
.workflow-filter { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 18px; }.workflow-filter a { min-height: 40px; padding: 9px 12px; border: 1px solid var(--border); border-radius: 999px; color: var(--primary-hover); background: var(--surface); font-size: 14px; font-weight: 700; text-decoration: none; }.workflow-filter a:hover, .workflow-filter a.is-active { border-color: var(--primary); color: var(--on-primary); background: var(--primary); }
.workflow-sent-list { display: grid; gap: 14px; }.workflow-sent-card { min-width: 0; padding: 18px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow); }.workflow-sent-card__heading { display: flex; min-width: 0; align-items: flex-start; justify-content: space-between; gap: 12px; }.workflow-sent-card__heading h2 { overflow-wrap: anywhere; }.workflow-sent-card__heading .field-help { margin: 6px 0; }.workflow-progress { display: grid; gap: 7px; margin: 14px 0 6px; }.workflow-progress__labels { display: flex; justify-content: space-between; gap: 10px; font-size: 14px; }.workflow-progress progress { width: 100%; height: 9px; overflow: hidden; border: 0; border-radius: 999px; appearance: none; background: var(--border); }.workflow-progress progress::-webkit-progress-bar { background: var(--border); }.workflow-progress progress::-webkit-progress-value { background: var(--success); }.workflow-progress progress::-moz-progress-bar { background: var(--success); }.workflow-sent-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 16px; }.workflow-sent-actions .button-link { min-width: 0; margin: 0; }
@media (max-width: 560px) { .accounting-section-heading { flex-direction: column; }.form-section--accounting { margin-inline: -2px; }.form-card--accounting { min-height: 0; }.form-badges { width: 100%; } }
.signature-confirm { display: flex; gap: 8px; align-items: flex-start; font-size: 14px; font-weight: 400; }
.signature-confirm input { flex: none; margin: 0; }
.signature-state { color: var(--muted); font-size: 14px; font-weight: 700; }
.signature-pending-warning { color: #b42318; font-weight: 700; }
.signature-pending-warning::before { content: "⚠ "; }
.signature-processing-status { margin-top: 10px; color: #b42318; font-size: 14px; font-weight: 700; }
.signature-processing-status--active > span { display: inline-block; color: #b42318; background: linear-gradient(90deg, #b42318, #dc4a40, #b42318); background-size: 200% auto; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; animation: signature-text-flow 1.35s linear infinite; }
.signature-processing-line { position: relative; height: 4px; margin-top: 7px; overflow: hidden; border-radius: 999px; background: #fee2e2; }
.signature-processing-line::before { position: absolute; top: 0; bottom: 0; left: 0; width: 35%; border-radius: inherit; background: linear-gradient(90deg, #b42318, #e86a4a, #b42318); animation: signature-line-run 1.25s ease-in-out infinite; content: ""; }
@keyframes signature-text-flow { from { background-position: 0% center; } to { background-position: 200% center; } }
@keyframes signature-line-run { from { transform: translateX(-120%); } to { transform: translateX(320%); } }
.date-component { position: relative; display: inline-block; width: 100%; }
.date-popover { position: absolute; z-index: 20; top: calc(100% + 4px); left: 0; width: 258px; padding: 10px; border: 1px solid var(--border); border-radius: var(--radius-control); background: var(--surface); box-shadow: var(--shadow); }
.date-popover-header { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 8px; }
.date-popover-header button { width: 32px; min-height: 30px; margin: 0; padding: 2px; }
.date-popover-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; text-align: center; }
.date-popover-grid span { min-height: 28px; padding-top: 5px; color: var(--muted); font-size: 12px; }
.date-popover-grid button { min-height: 30px; margin: 0; padding: 2px; border-color: transparent; background: transparent; color: var(--text); }
.date-popover-grid button:hover, .date-popover-grid button[aria-current="date"] { color: var(--primary-hover); border-color: var(--primary); background: var(--primary-soft); }
.profile-grid { display: grid; gap: 20px; }
.profile-grid > .form-entry { margin: 0; }
.profile-grid .signature-panel { border-top: 1px solid var(--border); padding-top: 24px; }
.profile-save-button::before, .profile-save-button::after { position: absolute; z-index: -1; inset: -5px; border: 2px solid rgb(47 137 181 / 45%); border-radius: var(--radius-control); opacity: 0; pointer-events: none; content: ""; }
.profile-save-button--attention::before, .profile-save-button--attention::after { animation: signature-save-echo 1.8s ease-out infinite; }
.profile-save-button--attention::after { animation-delay: .9s; }
.profile-save-button--attention { animation: signature-save-shake 2.8s ease-in-out infinite; box-shadow: 0 0 0 3px rgb(47 137 181 / 20%); }
.content-template-manager { display: grid; gap: 18px; }
.content-template-manager h2 { margin-bottom: 0; }
.content-template-add-form > div { display: flex; align-items: end; gap: 10px; }
.content-template-add-form input { min-width: 0; }
.content-template-add-form button { width: auto; flex: none; margin: 0; }
.content-template-table-wrap { overflow-x: auto; }
.content-template-table { width: 100%; border-collapse: collapse; background: var(--surface); font-size: 14px; }
.content-template-table th, .content-template-table td { padding: 12px; border: 1px solid var(--border); text-align: left; vertical-align: middle; }
.content-template-table th { color: var(--table-heading); background: var(--table-heading-background); white-space: nowrap; }
.content-template-table th:first-child, .content-template-table td:first-child { width: 72px; text-align: center; }
.content-template-table th:last-child { width: 250px; }
.content-template-table td > input { width: 100%; margin: 0; }
.content-template-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.content-template-actions button { width: auto; min-height: 38px; margin: 0; padding: 7px 12px; }
.button-danger-outline { color: var(--danger); border-color: #df9c9c; background: var(--surface); box-shadow: none; }
.button-danger-outline:hover { color: var(--danger-hover); border-color: var(--danger); background: var(--danger-soft); box-shadow: none; }
.content-template-empty { margin: 0; padding: 16px; border: 1px dashed #abcbdc; border-radius: var(--radius-control); color: var(--muted); background: #f8fbfc; }

dialog { z-index: var(--z-dialog); color: var(--text); background: var(--surface); animation: dialog-in 180ms ease-out; }
dialog::backdrop { background: rgb(36 55 70 / 35%); animation: fade-in 180ms ease-out; }
.confirm-dialog { width: min(92vw, 480px); padding: 24px; border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-hover); }
.confirm-dialog p { color: var(--muted); }
.dialog-actions { display: flex; justify-content: flex-end; gap: 10px; }
.dialog-actions button { width: auto; margin: 12px 0 0; padding-inline: 20px; }
.signature-view-dialog { width: min(92vw, 900px); max-width: none; max-height: 92vh; padding: 0; overflow: hidden; border: 1px solid var(--border); border-radius: var(--radius); }
.signature-dialog-content { display: grid; grid-template-rows: auto minmax(0, 1fr); max-height: 92vh; }
.signature-dialog-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 18px; border-bottom: 1px solid var(--border); }
.signature-dialog-close { width: 42px; min-height: 42px; margin: 0; padding: 4px; color: var(--muted); border-color: transparent; background: transparent; font-size: 26px; line-height: 1; }
.signature-dialog-close:hover { color: var(--primary-hover); background: var(--hover-soft); box-shadow: none; }
.signature-dialog-image { display: flex; min-height: min(68vh, 560px); align-items: center; justify-content: center; padding: 24px; overflow: auto; background: var(--surface); }
.signature-dialog-image img { display: block; width: auto; height: auto; max-width: 100%; max-height: 70vh; object-fit: contain; }

.preview-fields { display: grid; gap: 8px; }
.preview-fields div { display: grid; grid-template-columns: minmax(130px, 40%) 1fr; gap: 12px; padding-bottom: 8px; border-bottom: 1px solid var(--border); }
.preview-fields dd { margin: 0; overflow-wrap: anywhere; }
.preview-table-wrap { overflow-x: auto; }
.preview-signature { max-width: 180px; max-height: 100px; object-fit: contain; border-bottom: 1px solid #9eb4c1; }
.preview-actions { display: grid; gap: 10px; margin-top: 18px; }
#export-actions { scroll-margin-top: 24px; }
.preview-actions form { margin: 0; }
.preview-actions button { margin: 0; }
.preview-actions .btn-linked-form { color: #fff; border-color: #15803d; background: #16803d; }
.preview-actions .btn-linked-form:hover { border-color: #166534; background: #166534; }
.preview-actions .btn-linked-form:focus-visible { outline: 3px solid rgb(22 128 61 / 38%); outline-offset: 3px; }

.toast-region { position: fixed; z-index: var(--z-toast); top: 16px; right: 16px; display: grid; gap: 10px; width: min(390px, calc(100vw - 32px)); }
.toast { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 14px 16px; border: 1px solid #bcd8e7; border-left: 5px solid var(--info); border-radius: var(--radius); color: #28526a; background: var(--info-soft); box-shadow: var(--shadow); animation: toast-in 200ms ease-out; }
.toast-success { color: #245f45; border-color: #a9d8c2; border-left-color: var(--success); background: var(--success-soft); }
.toast-warning { color: #76500d; border-color: #ead49d; border-left-color: var(--warning); background: var(--warning-soft); }
.toast-error { color: #873838; border-color: #ebbbbb; border-left-color: var(--danger); background: var(--danger-soft); }
.toast button { width: 30px; min-height: 30px; margin: 0; padding: 0; color: currentColor; border-color: transparent; background: transparent; font-size: 22px; }
.toast button:hover { border-color: rgb(36 55 70 / 10%); background: rgb(255 255 255 / 45%); box-shadow: none; transform: none; }
.toast.is-leaving { opacity: 0; transform: translateX(20px); transition: opacity 200ms, transform 200ms; }
.loading-overlay { position: fixed; z-index: var(--z-loading); inset: 0; display: grid; place-items: center; padding: 20px; background: var(--overlay); opacity: 1; visibility: visible; pointer-events: auto; }
.loading-overlay[hidden] { display: grid; z-index: -1; opacity: 0; visibility: hidden; pointer-events: none; }
.loading-box { display: flex; min-width: 260px; align-items: center; gap: 14px; padding: 20px 24px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow-hover); }
.loading-copy p { margin: 0; font-weight: 700; }
.loading-copy small { display: block; margin-top: 2px; color: var(--muted); }
.spinner { flex: none; width: 28px; height: 28px; border: 3px solid var(--primary-soft); border-top-color: var(--primary); border-radius: 50%; animation: spin .75s linear infinite; }

/* Authenticated application shell */
.application-sidebar { position: fixed; z-index: var(--z-mobile-sidebar); inset: 0 auto 0 0; display: flex; width: min(86vw, 320px); height: 100dvh; flex-direction: column; overflow: hidden; color: var(--sidebar-text); border-right: 1px solid var(--border); background: var(--sidebar); box-shadow: 8px 0 24px rgb(36 55 70 / 10%); transform: translateX(-102%); transition: transform var(--speed) ease; }
.application-sidebar.is-open { transform: translateX(0); }
.sidebar-header { display: flex; min-height: 72px; align-items: center; padding: 12px 14px; border-bottom: 1px solid var(--border); }
.sidebar-brand { display: flex; min-width: 0; align-items: center; gap: 12px; color: var(--primary-hover); font-size: 18px; font-weight: 800; text-decoration: none; white-space: nowrap; }
.sidebar-icon { flex: none; width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.sidebar-close, .sidebar-collapse, .sidebar-logout button { width: auto; min-height: 42px; margin: 0; color: var(--sidebar-text); border-color: transparent; background: transparent; box-shadow: none; transform: none; }
.sidebar-close { margin-left: auto; padding: 9px; }
.sidebar-close:hover, .sidebar-collapse:hover, .sidebar-logout button:hover { color: var(--primary-hover); border-color: transparent; background: var(--hover-soft); box-shadow: none; transform: none; }
.sidebar-navigation { display: flex; flex: 1; flex-direction: column; gap: 6px; overflow-y: auto; padding: 16px 12px; }
.sidebar-link { position: relative; display: flex; min-height: 48px; align-items: center; gap: 13px; padding: 11px 13px; border-radius: 8px; color: var(--sidebar-text); font-weight: 700; text-decoration: none; white-space: nowrap; }
.sidebar-link:hover { color: var(--primary-hover); background: var(--hover-soft); }
.sidebar-link.is-active { color: var(--primary-hover); background: var(--primary-soft); font-weight: 800; }
.sidebar-link.is-active::before { position: absolute; inset: 8px auto 8px 0; width: 3px; border-radius: 3px; background: var(--primary); content: ""; }
.sidebar-bottom { flex: none; padding: 12px; border-top: 1px solid var(--border); }
.sidebar-account { display: flex; align-items: flex-start; gap: 12px; padding: 12px; border: 1px solid var(--border); border-radius: var(--radius-control); background: var(--surface); }
.sidebar-account-text { display: flex; min-width: 0; flex-direction: column; align-items: flex-start; gap: 2px; font-size: 13px; }
.sidebar-account-text strong { max-width: 180px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text); font-size: 14px; }
.sidebar-account-text > span:not(.badge) { color: var(--muted); }
.sidebar-theme-picker { margin-top: 12px; padding: 10px 12px; border: 1px solid var(--border); border-radius: var(--radius-control); background: var(--surface); }
.sidebar-theme-picker__label { display: block; margin-bottom: 8px; color: var(--muted); font-size: 12px; font-weight: 800; }
.sidebar-theme-picker__options { display: flex; flex-wrap: wrap; gap: 7px; }
.theme-dot { position: relative; width: 24px; min-width: 24px; min-height: 24px; height: 24px; margin: 0; padding: 0; border: 2px solid var(--surface); border-radius: 50%; box-shadow: 0 0 0 1px var(--border); transform: none; }
.theme-dot:hover { border-color: var(--surface); box-shadow: 0 0 0 2px var(--primary); transform: none; }
.theme-dot:focus-visible { outline: 3px solid var(--primary); outline-offset: 2px; }
.theme-dot.is-active { border-color: var(--surface); box-shadow: 0 0 0 2px var(--primary), 0 0 0 4px var(--surface); }
.theme-dot.is-active::after { position: absolute; inset: 0; display: grid; place-items: center; color: #fff; font-size: 13px; font-weight: 900; line-height: 1; text-shadow: 0 1px 2px rgb(0 0 0 / 65%); content: "✓"; }
.theme-dot[data-theme-value="light"] { background: linear-gradient(135deg, #fff 45%, #d8e7ef 46%); }
.theme-dot[data-theme-value="dark"] { background: linear-gradient(135deg, #0f172a, #475569); }
.theme-dot[data-theme-value="sky"] { background: linear-gradient(135deg, #e0f2fe, #0284c7); }
.theme-dot[data-theme-value="green"] { background: linear-gradient(135deg, #dcfce7, #32845a); }
.theme-dot[data-theme-value="purple"] { background: linear-gradient(135deg, #f3e8ff, #7654ba); }
.theme-dot[data-theme-value="amber"] { background: linear-gradient(135deg, #fef3c7, #d97706); }
.theme-dot[data-theme-value="gray"] { background: linear-gradient(135deg, #f1f5f9, #64748b); }
.sidebar-theme-picker__status { margin: 8px 0 0; color: var(--danger); font-size: 12px; font-weight: 700; }
.sidebar-logout { margin-top: 6px; }
.sidebar-logout button { display: flex; width: 100%; justify-content: flex-start; gap: 13px; padding: 10px 13px; }
.sidebar-footer { position: relative; isolation: isolate; margin: 12px 0 0; color: transparent; background: linear-gradient(105deg, #ffcf70 0%, #ff8a3d 30%, #ef4b30 52%, #ffd27a 72%, #ff9b45 100%); background-clip: text; -webkit-background-clip: text; background-size: 180% 100%; font-size: 12px; font-weight: 700; text-align: center; text-shadow: 0 1px 7px rgb(255 105 45 / 34%), 0 0 12px rgb(239 75 48 / 18%); animation: sidebar-footer-flame 7s ease-in-out infinite; }
.sidebar-footer::before, .sidebar-footer::after { position: absolute; z-index: -1; pointer-events: none; content: ""; }
.sidebar-footer::before { inset: -7px 8%; border-radius: 50%; background: radial-gradient(ellipse, rgb(255 116 49 / 23%), rgb(239 75 48 / 8%) 48%, transparent 72%); filter: blur(5px); animation: sidebar-footer-flame-glow 7s ease-in-out infinite; }
.sidebar-footer::after { inset: 0; color: #f86b36; content: attr(data-flame-text); filter: blur(5px); opacity: .22; }
.sidebar-collapse { display: none; }
.sidebar-mobile-trigger { position: fixed; z-index: 29; top: 12px; left: 12px; width: 46px; min-height: 46px; margin: 0; padding: 10px; border-color: var(--border); color: var(--primary-hover); background: var(--surface); box-shadow: var(--shadow); }
.sidebar-mobile-trigger:hover { color: var(--primary-hover); background: var(--hover-soft); }
.sidebar-mobile-trigger svg { width: 25px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.sidebar-backdrop { position: fixed; z-index: var(--z-backdrop); inset: 0; display: block; width: 100%; height: 100%; min-height: 0; margin: 0; padding: 0; border: 0; border-radius: 0; background: rgb(36 55 70 / 35%); opacity: 1; visibility: visible; pointer-events: auto; transition: opacity var(--speed), visibility var(--speed); }
.sidebar-backdrop[hidden] { display: block; opacity: 0; visibility: hidden; pointer-events: none; }
.sidebar-backdrop:hover { background: rgb(36 55 70 / 35%); box-shadow: none; transform: none; }
.sidebar-drawer-open { overflow: hidden; }
.app-content { width: 100%; max-width: none; padding: 76px 14px 28px; overflow-x: hidden; }

@keyframes spin { to { transform: rotate(360deg); } }
@keyframes toast-in { from { opacity: 0; transform: translateY(-10px); } }
@keyframes dialog-in { from { opacity: 0; transform: scale(.98); } }
@keyframes fade-in { from { opacity: 0; } }
@keyframes login-border-spin { to { transform: rotate(1turn); } }
@keyframes nyanCatFly { from { transform: translate3d(calc(-100% - 40px), 0, 0); } to { transform: translate3d(calc(100vw + 40px), 0, 0); } }
@keyframes signature-save-shake { 0%, 72%, 100% { transform: translateX(0); } 78% { transform: translateX(-4px); } 84% { transform: translateX(4px); } 90% { transform: translateX(-3px); } 96% { transform: translateX(3px); } }
@keyframes signature-save-echo { 0% { opacity: .55; transform: scale(1); } 100% { opacity: 0; transform: scale(1.12); } }
@keyframes sidebar-footer-flame { 0%, 100% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } }
@keyframes sidebar-footer-flame-glow { 0%, 100% { opacity: .72; transform: scale(.96); } 50% { opacity: 1; transform: scale(1.03); } }

.validation-result-dialog { width: min(92vw, 460px); padding: 26px; border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-hover); text-align: center; }
.validation-result-dialog h2 { margin-top: 12px; }
.validation-result-dialog p { color: var(--muted); }
.validation-result-icon { display: grid; width: 52px; height: 52px; place-items: center; margin: 0 auto; border-radius: 50%; color: var(--success); background: var(--success-soft); }
.validation-result-dialog[data-validation-result-kind="failure"] .validation-result-icon { color: var(--danger); background: var(--danger-soft); }
.validation-result-icon svg { width: 30px; fill: none; stroke: currentColor; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; }

@media (min-width: 640px) {
  .page-shell { padding-top: 48px; }
  .mobile-user-list { display: none; }
  .desktop-user-table-wrap { display: block; }
  .form-catalogue { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .form-entry, .preview-sheet { padding: 26px; }
  .user-card { display: grid; grid-template-columns: minmax(180px, 1fr) auto; gap: 8px 24px; align-items: start; }
  .user-card dl, .user-actions { grid-column: 1 / -1; }
  .user-card dl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 639px) {
  .maintenance-banner { align-items: stretch; flex-direction: column; }.maintenance-banner button { width: 100%; }
  .content-template-add-form > div { align-items: stretch; flex-direction: column; }
  .content-template-add-form button { width: 100%; }
  .content-template-table-wrap { overflow: visible; }
  .content-template-table, .content-template-table tbody, .content-template-table tr, .content-template-table td { display: block; width: 100%; }
  .content-template-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .content-template-table tbody { display: grid; gap: 12px; }
  .content-template-table tr { padding: 14px; border: 1px solid var(--border); border-radius: var(--radius-control); background: var(--surface); }
  .content-template-table td { padding: 7px 0; border: 0; }
  .content-template-table td::before { display: block; margin-bottom: 3px; color: var(--muted); font-size: 12px; font-weight: 700; content: attr(data-label); }
  .content-template-table th:first-child, .content-template-table td:first-child, .content-template-table th:last-child { width: auto; text-align: left; }
  .content-template-actions { gap: 10px; }
  .content-template-actions button { flex: 1 1 calc(50% - 5px); min-height: 44px; }
}

@media (max-width: 768px) {
  .profile-page-header { align-items: stretch; flex-direction: column; margin-top: -8px; gap: 12px; }
  .profile-save-button { width: 100%; min-width: 0; }
  .workflow-primary-action { min-height: 52px; }.workflow-sent-actions { grid-template-columns: 1fr; }.workflow-sent-actions .button-link { min-height: 48px; }.workflow-slot-list li { gap: 8px; }.workflow-slot-list .workflow-status { flex: none; }
  body.login-page { background-attachment: scroll; background-position: center top; } body.login-page .page-shell { min-height: auto; padding-inline: 16px; }
  .history-card { align-items: stretch; flex-direction: column; gap: 14px; padding: 16px; }.history-actions { display: grid; width: 100%; grid-template-columns: repeat(2, minmax(0, 1fr)); }.history-actions form, .history-action { min-width: 0; width: 100%; }.history-filter { grid-template-columns: 1fr; }.history-filter button { width: 100%; }.history-pagination { justify-content: space-between; }
  .assignment-permission-table-wrap { display: none; }.assignment-permission-cards { display: block; }.assignment-selection-toolbar { display: grid; grid-template-columns: 1fr 1fr; }.assignment-selection-toolbar strong { grid-column: 1 / -1; }.assignment-selection-toolbar button { width: 100%; }.assignment-candidate { align-items: flex-start; }.assignment-candidate em { margin-left: 0; }
}

@media (min-width: 769px) { .history-table-wrap { display: block; }.history-mobile-list { display: none; }.history-actions { min-width: 240px; }.history-filter { grid-template-columns: repeat(4, minmax(0, 1fr)) auto auto; }.history-filter-clear { display: inline-flex; min-height: 46px; align-items: center; justify-content: center; padding: 10px 14px; border: 1px solid var(--border); border-radius: var(--radius-control); color: var(--primary-hover); font-weight: 700; text-decoration: none; } }

@media (min-width: 800px) {
  .sidebar-mobile-trigger, .sidebar-close, .sidebar-backdrop { display: none !important; }
  .application-sidebar { z-index: var(--z-sidebar); width: var(--sidebar-width); transform: none; transition: width var(--speed) ease; box-shadow: 4px 0 16px rgb(36 55 70 / 6%); }
  .sidebar-collapse { display: flex; flex: none; align-items: center; justify-content: flex-start; gap: 13px; margin: 0 12px 12px; padding: 10px 13px; }
  .app-content { width: calc(100% - var(--sidebar-width)); margin-left: var(--sidebar-width); padding: 40px clamp(24px, 4vw, 64px); transition: margin-left var(--speed) ease, width var(--speed) ease; }
  .sidebar-collapsed .application-sidebar { width: var(--sidebar-collapsed-width); }
  .sidebar-collapsed .app-content { width: calc(100% - var(--sidebar-collapsed-width)); margin-left: var(--sidebar-collapsed-width); }
  .sidebar-collapsed .sidebar-label { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }
  .sidebar-collapsed .sidebar-header { justify-content: center; padding-inline: 12px; }
  .sidebar-collapsed .sidebar-brand, .sidebar-collapsed .sidebar-link, .sidebar-collapsed .sidebar-collapse, .sidebar-collapsed .sidebar-logout button { justify-content: center; }
  .sidebar-collapsed .sidebar-account { justify-content: center; padding-inline: 10px; }
  .sidebar-collapsed .sidebar-theme-picker { display: grid; place-items: center; padding-inline: 8px; }
  .sidebar-collapsed .sidebar-theme-picker__options { justify-content: center; gap: 5px; }
  .sidebar-collapsed .theme-dot { width: 20px; min-width: 20px; min-height: 20px; height: 20px; }
  .sidebar-collapsed .sidebar-navigation { padding-inline: 8px; }
  .sidebar-collapsed .sidebar-link { padding-inline: 12px; }
  .sidebar-collapsed .sidebar-footer { display: none; }
  .form-catalogue { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
  .desktop-user-table-wrap, .repeater-section, .preview-table-wrap { max-width: 100%; overflow-x: auto; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .spinner { animation: none; }
  .login-shell::before { animation: none; }
  .profile-save-button--attention { animation: none; box-shadow: 0 0 0 3px rgb(47 137 181 / 42%); }
  .profile-save-button--attention::before, .profile-save-button--attention::after { animation: none; opacity: .5; }
  .signature-processing-status--active > span, .signature-processing-line::before { animation: none; }
  .signature-processing-line::before { width: 100%; transform: none; }
  .sidebar-footer, .sidebar-footer::before { animation: none; }
  .sidebar-footer { background-position: 48% 50%; }
  .nyan-cat-runner { display: none !important; animation: none !important; }
}

@media (max-width: 639px) {
  .nyan-cat-runner { top: 10px; width: clamp(80px, 26vw, 104px); }
}

@media print {
  .nyan-cat-runner { display: none !important; }
}