/* Identité des fiches Le Biohacker : bandeaux ardoise, accents émeraude,
   fond blanc pour les zones à remplir et liens conservés dans le PDF. */
@page { size: A4 portrait; margin: 8mm; }
* { box-sizing: border-box; }
html { background: #e2e8f0; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
body { margin: 0; color: #0f172a; font: 14px/1.4 Arial, Helvetica, sans-serif; }
a { color: #065f46; text-underline-offset: 3px; }
a:focus-visible, button:focus-visible, .table-wrap:focus-visible { outline: 3px solid #059669; outline-offset: 4px; }
.toolbar { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; max-width: var(--sheet-width, 194mm); margin: 20px auto 12px; }
.actions { display: flex; flex-wrap: wrap; gap: 8px; }
.button { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 10px 14px; border: 1px solid #64748b; border-radius: 8px; color: #0f172a; background: #ffffff; font: inherit; font-weight: 700; text-decoration: none; cursor: pointer; }
.button:hover { background: #f1f5f9; }
.button-primary { border-color: #065f46; color: #ffffff; background: #065f46; }
.button-primary:hover { background: #064e3b; }
.sheet { width: min(var(--sheet-width, 194mm), calc(100% - 32px)); margin: 0 auto 24px; padding: 12px; background: #ffffff; }
header { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 12px; border-radius: 10px; color: #f8fafc; background: #020617; }
.identity { display: flex; align-items: center; gap: 12px; min-width: 0; }
.logo { width: 44px; height: 44px; flex: 0 0 44px; border: 1px solid #34d399; border-radius: 8px; object-fit: cover; }
.brand { margin: 0 0 4px; color: #6ee7b7; font-size: 10px; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
h1 { margin: 0; font-size: 24px; line-height: 1.12; letter-spacing: -.015em; text-wrap: balance; }
h2 { margin: 14px 0 8px; color: #065f46; font-size: 17px; text-wrap: balance; }
.header-note { flex-shrink: 0; color: #cbd5e1; font-size: 12px; text-align: right; }
p { margin: 8px 0; text-wrap: pretty; }
.lead { color: #334155; }
.note, .seuils { margin: 10px 0; padding: 9px 11px; border: 1px solid #a7f3d0; border-radius: 8px; color: #164e3d; background: #ecfdf5; }
.warn { margin: 10px 0; padding: 9px 11px; border: 1px solid #fca5a5; border-radius: 8px; color: #991b1b; background: #fef2f2; font-size: 12px; }
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; table-layout: fixed; margin-top: 10px; font-size: 12px; }
th, td { padding: 6px; border: 1px solid #cbd5e1; vertical-align: top; overflow-wrap: break-word; }
th { color: #064e3b; background: #d1fae5; text-align: left; }
.key, .legend { color: #334155; font-size: 12px; }
.caution { margin: 10px 0; padding: 8px 10px; border: 1px solid #fdba74; border-radius: 8px; color: #7c2d12; background: #fff7ed; font-size: 12px; }
footer { display: flex; justify-content: space-between; align-items: center; gap: 14px; margin-top: 12px; padding: 9px 11px; border-radius: 7px; color: #cbd5e1; background: #020617; font-size: 11px; }
footer a { color: #6ee7b7; font-weight: 700; overflow-wrap: anywhere; }
.copyright { flex-shrink: 0; }
@media screen and (max-width: 780px) {
  .toolbar { margin: 16px; }
  header { align-items: flex-start; flex-direction: column; }
  .header-note { text-align: left; }
  h1 { font-size: clamp(20px, 4vw, 24px); }
  footer { align-items: flex-start; flex-direction: column; gap: 8px; }
}
@media print {
  html, body { background: #ffffff; }
  body { font-size: 9.5pt; line-height: 1.28; }
  .toolbar { display: none; }
  .sheet { width: var(--sheet-width, 194mm); margin: 0; padding: 0; break-after: page; }
  .sheet:last-child { break-after: auto; }
  header { padding: 8px 10px; }
  .logo { width: 40px; height: 40px; flex-basis: 40px; }
  .brand { font-size: 7.4pt; }
  h1 { font-size: 16pt; }
  h2 { font-size: 11pt; margin: 9px 0 6px; }
  .header-note { font-size: 8pt; }
  .note, .seuils { margin: 7px 0; padding: 7px 9px; }
  .warn, .caution { margin: 7px 0; padding: 7px 9px; font-size: 8pt; }
  .table-wrap { overflow: visible; }
  table { min-width: 0 !important; font-size: 8pt; margin-top: 7px; }
  th, td { padding: 4px 5px; }
  .key, .legend { font-size: 8pt; }
  footer { margin-top: 7px; padding: 7px 9px; font-size: 7.5pt; }
  header, footer, .note, .warn, .caution, .seuils, table { break-inside: avoid; }
}
