.hf-detail { min-width: 0; padding: 0 0 0 18px; border-left: 1px solid var(--border, #d5dfe0); }
.hf-detail select { width: 100%; min-height: 40px; padding: 8px 10px; font: inherit; border: 1px solid #d5dfe0; border-radius: 6px; background: white; }
.hf-detail-head, .hf-actions, .hf-record { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.hf-detail-head h2, .hf-detail-head p { margin: 0 0 5px; }
.hf-state { color: #12615b; }
.hf-detail-summary { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.hf-detail-summary div, .hf-record div { display: grid; gap: 4px; min-width: 0; }
.hf-detail strong, .hf-detail span, .hf-detail p { overflow-wrap: anywhere; }
.hf-detail small { color: #55646a; display: block; }
.hf-steps { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 6px; font-size: 12px; }
.hf-steps li { border-top: 4px solid #d8e0e1; padding-top: 7px; }
.hf-steps li.done { border-color: #12615b; font-weight: bold; }
.hf-action { display: inline-flex; padding: 9px 12px; border: 1px solid #a6c6c2; color: #125e58; border-radius: 6px; text-decoration: none; background: #f0f6f5; font-weight: 700; font-size: 14px; }
.hf-action:hover { background: #e0eeeb; }
.hf-actions { justify-content: flex-start; }
.hf-fold { border-top: 1px solid #d5dfe0; padding: 14px 0; }
.hf-fold summary { font-weight: 700; cursor: pointer; }
.hf-fold form { margin-top: 14px; }
.hf-record { padding: 12px 0; border-bottom: 1px solid #d5dfe0; }
.hf-record > div { flex: 1 1 180px; }
.hf-warning { border-left: 4px solid #b44f28; padding: 10px 14px; background: #fff3e9; }
.hf-note { white-space: pre-wrap; overflow-wrap: anywhere; }
.hf-history { list-style: none; margin: 0; padding: 0; }
.hf-history li { display: grid; grid-template-columns: 150px minmax(0,1fr); gap: 16px; padding: 12px 0; border-bottom: 1px solid #d5dfe0; }
.hf-history time { color: #526467; font-size: 13px; }
.hf-reminders { border-top: 1px solid #d5dfe0; margin-top: 24px; padding-top: 16px; }
.hf-document { margin: 0; font-family: Arial,sans-serif; line-height: 1.45; color: #15282c; background: #eef3f4; }
.hf-document * { box-sizing: border-box; letter-spacing: 0; }
.hf-document .hf-logo { width: 175px; max-width: 100%; height: auto; object-fit: contain; }
.hf-public { min-height: 100vh; padding: 40px 20px; background: #f2f6f7 url('/assets/portal-dualbp-background.png') center/cover fixed; }
.hf-public main { max-width: 1060px; margin: 0 auto; padding: 32px; border-radius: 8px; background: rgba(255,255,255,.97); }
.hf-public main.hf-gate { max-width: 470px; margin: 10vh auto 0; }
.hf-public h1 { font-size: 28px; line-height: 1.2; }
.hf-public h2 { font-size: 20px; }
.hf-public form, .hf-public label { display: grid; gap: 10px; }
.hf-document input, .hf-document button { font: inherit; padding: 10px 14px; border: 1px solid #b7c8c9; border-radius: 6px; }
.hf-document button { background: #12615b; color: white; cursor: pointer; }
.hf-heading { border-bottom: 1px solid #d5dfe0; padding-bottom: 20px; }
.hf-public-result { border-top: 1px solid #d5dfe0; border-bottom: 1px solid #d5dfe0; margin-bottom: 24px; padding: 12px 0; }
@media(min-width:1000px) {
  .harness-layout { grid-template-columns: minmax(240px, .55fr) minmax(0, 1.45fr); }
}
.hf-timeline { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); list-style: none; margin: 36px 0; padding: 0; }
.hf-timeline li { display: grid; justify-items: center; text-align: center; position: relative; gap: 8px; padding: 0 12px; }
.hf-timeline img { width: 64px; height: 64px; object-fit: contain; }
.hf-timeline i { width: 18px; height: 18px; border: 3px solid #bac9cb; border-radius: 50%; background: white; z-index: 1; }
.hf-timeline li::before { content: ''; position: absolute; height: 3px; background: #bac9cb; left: -50%; right: 50%; top: 80px; }
.hf-timeline li:first-child::before { display: none; }
.hf-timeline li.done::before, .hf-timeline li.done i { background: #137169; border-color: #137169; }
.hf-timeline time { font-size: 13px; color: #526467; }
.hf-toolbar { position: sticky; top: 0; z-index: 2; display: flex; align-items: center; gap: 20px; flex-wrap: wrap; padding: 14px 24px; background: white; border-bottom: 1px solid #ccd6d7; }
.hf-toolbar label { display: flex; gap: 8px; align-items: center; }
.hf-sheet { width: 210mm; min-height: 297mm; margin: 24px auto; padding: 12mm; background: white; display: flex; flex-direction: column; font-size: 11pt; line-height: 1.3; }
.hf-sheet[hidden] { display: none !important; }
.hf-copy { text-transform: uppercase; font-size: 9pt; color: #49676a; margin: 0 0 10px; }
.hf-print-head { display: flex; justify-content: space-between; gap: 24px; align-items: start; padding-bottom: 18px; border-bottom: 3px solid #12615b; }
.hf-print-head h1 { font-size: 24pt; margin: 14px 0 4px; line-height: 1.1; }
.hf-print-head p { margin: 0; }
.hf-qr { width: 32mm; flex-shrink: 0; text-align: center; font-size: 8pt; }
.hf-qr img { width: 29mm; height: 29mm; display: block; margin: auto; }
.hf-print-section { padding: 11px 0; border-bottom: 1px solid #ccd6d7; }
.hf-print-section h2 { font-size: 12pt; margin: 0 0 10px; color: #12615b; }
.hf-print-section h3 { font-size: 10pt; margin: 12px 0 6px; }
.hf-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px 20px; }
.hf-customer { grid-template-columns: repeat(3,minmax(0,1fr)); }
.hf-product { grid-template-columns: repeat(4,minmax(0,1fr)); }
.hf-fields div { min-width: 0; break-inside: avoid; }
.hf-fields span { display: block; color: #526467; font-size: 9pt; }
.hf-fields strong { display: block; overflow-wrap: anywhere; font-weight: 600; }
.hf-sheet table { border-collapse: collapse; width: 100%; margin-top: 16px; font-size: 10pt; }
.hf-sheet th, .hf-sheet td { text-align: left; border: 1px solid #b9c9cb; padding: 7px 9px; overflow-wrap: anywhere; }
.hf-sheet th { background: #eef5f4; }
.hf-sheet th:last-child, .hf-sheet td:last-child { width: 38mm; }
.hf-signatures { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 28px; padding-top: 16mm; padding-bottom: 7mm; break-inside: avoid; }
.hf-signatures div { border-top: 1px solid #222; padding-top: 5px; font-size: 9pt; text-align: center; }
.hf-company { margin-top: auto; padding-top: 12px; border-top: 1px solid #ccd6d7; font-size: 8pt; line-height: 1.6; break-inside: avoid; }
@media(max-width:700px) {
  .hf-detail { padding: 16px 0 0; border-left: 0; border-top: 1px solid #d5dfe0; }
  .hf-detail-summary { grid-template-columns: 1fr; }
  .hf-history li { grid-template-columns: 1fr; gap: 4px; }
  .hf-public { padding: 16px 10px; }
  .hf-public main { padding: 22px 16px; }
  .hf-timeline { grid-template-columns: 1fr; gap: 24px; }
  .hf-timeline li { grid-template-columns: 44px 18px 1fr; text-align: left; justify-items: start; padding: 0; align-items: center; }
  .hf-timeline img { width: 40px; height: 40px; grid-row: span 2; }
  .hf-timeline i { grid-row: span 2; }
  .hf-timeline time { grid-column: 3; }
  .hf-timeline li::before { left: 60px; right: auto; top: calc(-24px - 50%); bottom: 50%; height: auto; width: 3px; }
  .hf-sheet { width: 100%; min-height: 0; padding: 20px; margin: 16px 0; }
  .hf-print-head h1 { font-size: 22px; }
  .hf-print-head .hf-logo { width: 130px; }
  .hf-qr { width: 80px; }
  .hf-qr img { width: 80px; height: 80px; }
  .hf-customer, .hf-product { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@page harness-protocol { size: A4 portrait; margin: 12mm; }
@media print {
  .hf-print { background: white; color: black; }
  .hf-print .hf-toolbar { display: none; }
  .hf-sheet { page: harness-protocol; width: 100%; min-height: 272mm; padding: 0; margin: 0; display: block; break-after: page; color: black; }
  .hf-sheet:last-child { break-after: auto; }
  .hf-sheet * { color: black; }
  .hf-print-head { break-inside: avoid; }
  .hf-sheet h2, .hf-sheet h3 { break-after: avoid; }
  .hf-sheet thead { display: table-header-group; }
  .hf-sheet tr { break-inside: avoid; }
  .hf-sheet .hf-company { margin-top: 10mm; }
}
