* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; background: #7f8c8d; color: #111; font-family: Tahoma, Verdana, Arial, sans-serif; font-size: 12px; }
body { padding: 12px; }
a { color: #003399; }
a:hover { color: #cc0000; }
button, input, textarea, select { font-family: Tahoma, Verdana, Arial, sans-serif; font-size: 12px; }
code { font-family: "Courier New", monospace; font-size: 11px; }
.app-shell { max-width: 1280px; min-width: 780px; margin: 0 auto; background: #c0c0c0; border: 2px outset #eee; box-shadow: 6px 6px 0 rgba(0,0,0,.25); }
.titlebar { min-height: 34px; padding: 5px 8px; display: flex; align-items: center; justify-content: space-between; background: linear-gradient(90deg,#000080,#1084d0); color: #fff; font-size: 15px; letter-spacing: .3px; }
.logo-box { display: inline-block; width: 23px; height: 23px; line-height: 23px; text-align: center; background: #eee; color: #000080; border: 2px outset white; margin-right: 5px; }
.version { font-size: 10px; color: #d8e8ff; }
.titlebar-right { font-size: 11px; font-weight: normal; }
.menubar { min-height: 29px; background: #d4d0c8; border-bottom: 1px solid #808080; padding: 5px 8px; display: flex; gap: 8px; align-items: center; }
.menubar a, .menu-link { color: #000; text-decoration: none; border: 0; background: transparent; padding: 2px 4px; cursor: pointer; }
.menubar a:hover, .menu-link:hover { background: #000080; color: #fff; }
.inline { display: inline; margin: 0; }
.work-area { display: flex; min-height: 680px; }
.sidebar { width: 205px; flex: 0 0 205px; background: #b7b7b7; border-right: 2px groove #eee; padding: 8px; }
.content { flex: 1; min-width: 0; padding: 10px; background: #ece9d8; }
.content-full { padding: 30px; }
.statusbar { min-height: 24px; padding: 4px 7px; border-top: 2px groove #eee; background: #c0c0c0; display: flex; justify-content: space-between; color: #333; font-size: 10px; }
.panel, .window { border: 2px outset #efefef; background: #d4d0c8; margin-bottom: 10px; }
.panel-title, .window-title { background: #000080; color: #fff; font-weight: bold; padding: 4px 7px; min-height: 23px; }
.window-title { background: linear-gradient(90deg,#000080,#356aa0); }
.window-body { padding: 10px; }
.no-pad { padding: 0; }
.nav-item, .nav-button { display: block; width: 100%; text-align: left; color: #000; text-decoration: none; padding: 7px 6px; border: 0; border-bottom: 1px solid #aaa; background: #d4d0c8; cursor: pointer; }
.nav-item:hover, .nav-button:hover { background: #000080; color: #fff; }
.small-panel { margin-top: 12px; }
.pad8 { padding: 8px; line-height: 1.6; overflow-wrap: anywhere; }
.muted { color: #666; font-size: 10px; }
.page-head { display: flex; justify-content: space-between; align-items: center; border-bottom: 2px solid #000080; margin-bottom: 10px; padding: 0 2px 6px; }
h1 { font-size: 18px; margin: 0; color: #000080; }
.btn { display: inline-block; color: #000; text-decoration: none; background: #d4d0c8; border: 2px outset #fff; padding: 5px 11px; min-height: 26px; cursor: pointer; }
.btn:hover { color: #000; background: #e8e5dc; }
.btn:active { border-style: inset; }
.btn.primary { background: #000080; color: #fff; border-color: #8295d6; font-weight: bold; }
.btn.big { padding: 9px 18px; font-size: 13px; }
.btn.mini { padding: 2px 7px; min-height: 21px; font-size: 10px; }
.form-actions { padding: 10px; text-align: right; background: #d4d0c8; border: 2px outset #eee; margin-bottom: 10px; }
.sticky-actions { position: sticky; bottom: 0; z-index: 5; }
.actions-row { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.actions-row form { margin: 0; }
.flash { padding: 8px 10px; border: 2px outset #fff; margin-bottom: 10px; font-weight: bold; }
.flash.success { background: #c9efc9; color: #064c06; }
.flash.error { background: #ffd4d4; color: #7b0000; }
.notice { padding: 9px; background: #ffffcc; border: 1px solid #999900; }
.window.important { border-color: #ffd24a; }
.window.important > .window-title { background: linear-gradient(90deg,#6b3d00,#c57900); }
.login-window { max-width: 600px; margin: 80px auto; }
.window.narrow { max-width: 720px; margin: 60px auto; }
.old-logo { font-family: "Arial Black", Arial, sans-serif; font-size: 36px; color: #000080; border: 2px inset #fff; background: #fff; padding: 18px; text-align: center; margin-bottom: 14px; }
.old-logo span { font-family: Tahoma, sans-serif; font-size: 11px; letter-spacing: 3px; color: #555; }
.stats-grid { display: grid; grid-template-columns: repeat(6, minmax(100px,1fr)); gap: 7px; margin-bottom: 10px; }
.stat { border: 2px outset #fff; background: #d4d0c8; padding: 10px; text-align: center; }
.stat b { display: block; font-size: 24px; color: #000080; }
.stat span { font-size: 10px; text-transform: uppercase; }
.data-table, .form-grid, .form-table, .editor-table, .detail-table, .info-table, .status-table { width: 100%; border-collapse: collapse; }
.data-table th { background: #808080; color: #fff; text-align: left; font-size: 10px; border: 1px solid #555; padding: 5px; }
.data-table td { background: #f7f7f7; border: 1px solid #aaa; padding: 5px; vertical-align: top; }
.data-table tbody tr:nth-child(even) td { background: #eaeaea; }
.data-table .empty, .empty { text-align: center; padding: 25px; color: #666; font-style: italic; }
.form-grid th, .form-table th, .info-table th, .status-table th { text-align: left; width: 16%; background: #d0d0d0; border: 1px solid #999; padding: 6px; }
.form-grid td, .form-table td, .info-table td, .status-table td { background: #f8f8f8; border: 1px solid #aaa; padding: 6px; }
.text, input[type=date], input[type=number], select, textarea { border: 2px inset #fff; background: #fff; padding: 4px; }
.text { min-width: 170px; }
.text.wide, .wide { width: 95%; }
.uppercase { text-transform: uppercase; }
.checkbox-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; padding: 5px 0 12px; }
.class-row { display: flex; gap: 16px; align-items: center; border-top: 1px solid #aaa; padding: 8px 0; }
.editor-table th, .editor-table td { border: 1px solid #777; }
.editor-table thead th { background: #000; color: #fff; text-align: center; padding: 6px; }
.editor-table tbody th { width: 12%; background: #d3d3d3; vertical-align: top; padding: 6px; text-align: left; }
.editor-table tbody th span { display: block; font-size: 9px; font-weight: normal; margin-top: 5px; }
.editor-table td { width: 29%; padding: 0; background: #fff; }
.editor-table textarea { width: 100%; min-height: 100px; border: 0; resize: vertical; padding: 6px; }
textarea.summary { width: 100%; min-height: 160px; resize: vertical; }
.detail-table th { width: 36%; background: #d3d3d3; border: 1px solid #777; padding: 10px; text-align: left; vertical-align: top; }
.detail-table th span { display: block; font-weight: normal; font-size: 10px; color: #555; margin-top: 5px; }
.detail-table td { border: 1px solid #777; background: #fff; padding: 0; }
.detail-table textarea { width: 100%; min-height: 105px; border: 0; resize: vertical; padding: 7px; }
.two-col { display: grid; grid-template-columns: 1.2fr .8fr; gap: 10px; }
.badge { display: inline-block; border: 1px solid #444; padding: 2px 6px; font-size: 10px; background: #ddd; color: #000; white-space: nowrap; }
.wf-draft { background: #ddd; }
.wf-drafting { background: #fff3a0; }
.wf-ready_signature { background: #ffd1a8; }
.wf-signed { background: #cfe4ff; }
.wf-validated { background: #c6efce; }
.hashbox { background: #fff; border: 1px inset #999; padding: 6px; overflow-wrap: anywhere; }
.report-text { white-space: pre-wrap; min-height: 70px; background: #fff; border: 1px inset #999; margin: 8px; }
.inline-form { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin: 0; }
.form-stack { display: grid; gap: 8px; max-width: 720px; }
.filter-form { display: flex; align-items: end; gap: 10px; flex-wrap: wrap; }
.filter-form label { display: grid; gap: 3px; }
.truncate { max-width: 420px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.top-gap { margin-top: 10px; }
#signatureCanvas { width: min(100%,620px); height: 150px; border: 2px inset #fff; background: #fff; touch-action: none; cursor: crosshair; }
.stamp-preview { max-width: 260px; max-height: 100px; border: 1px solid #777; margin-top: 8px; background: #fff; }
.error-window { max-width: 760px; margin: 60px auto; }
.error-icon { float: left; width: 44px; height: 44px; line-height: 44px; text-align: center; background: #c00000; color: #fff; font-size: 28px; font-weight: bold; margin-right: 12px; border: 2px outset #fff; }
.error-message { white-space: pre-wrap; font-family: Tahoma, sans-serif; font-size: 12px; min-height: 45px; }
.audit-table td { font-size: 10px; }
hr { border: 0; border-top: 1px solid #888; border-bottom: 1px solid #fff; margin: 12px 0; }
@media (max-width: 900px) {
  body { padding: 0; }
  .app-shell { min-width: 0; width: 100%; box-shadow: none; }
  .sidebar { display: none; }
  .content { padding: 6px; }
  .stats-grid { grid-template-columns: repeat(2,1fr); }
  .two-col { grid-template-columns: 1fr; }
  .checkbox-grid { grid-template-columns: repeat(2,1fr); }
  .data-table { font-size: 10px; }
  .menubar { overflow-x: auto; white-space: nowrap; }
}
@media print {
  body { padding: 0; background: white; }
  .titlebar, .menubar, .sidebar, .statusbar, .form-actions, .btn, .flash { display: none !important; }
  .app-shell { border: 0; box-shadow: none; max-width: none; }
  .content { background: white; padding: 0; }
}
.integrity-ok { color: #006600; }
.integrity-bad { color: #b00000; background: #fff0f0; }