/* Compagnon D&D 5e — version 11.1 */
/* ============ FEUILLE OFFICIELLE (structure WotC, DA parchemin) ============ */
  .of-tabs { display:flex; gap:6px; margin-bottom:14px; border-bottom:2px solid var(--border-aged); }
  .of-tab { background:var(--parchment-dark); border:1px solid var(--border-aged); border-bottom:none;
    border-radius:8px 8px 0 0; padding:8px 20px; font-family:'Cinzel',serif; font-size:13px; cursor:pointer;
    color:var(--ink-soft); margin-bottom:-2px; }
  .of-tab:hover { color:var(--gold); }
  .of-tab.active { background:var(--card); color:var(--blood); font-weight:700; border-color:var(--gold);
    border-bottom:2px solid var(--card); }

  /* --- En-tête officiel --- */
  .of-head { display:grid; grid-template-columns:minmax(200px,1.1fr) 2fr; gap:10px; margin-bottom:12px; }
  .of-name-box { border:2px solid var(--ink); border-radius:10px; background:var(--card); padding:10px 14px;
    display:flex; align-items:center; gap:12px; }
  .of-name-box .of-crest { width:52px; height:52px; border-radius:50%; border:2px solid var(--gold);
    background:var(--parchment-dark); display:flex; align-items:center; justify-content:center;
    font-family:'Cinzel',serif; font-size:22px; color:var(--blood); overflow:hidden; flex-shrink:0; }
  .of-name-box .of-nm { font-family:'Cinzel',serif; font-size:20px; font-weight:700; line-height:1.15; }
  .of-name-box .of-lbl { font-size:9px; letter-spacing:.12em; color:var(--ink-soft); text-transform:uppercase; }
  .of-meta { border:2px solid var(--ink); border-radius:10px; background:var(--card);
    display:grid; grid-template-columns:repeat(3,1fr); }
  .of-meta div { padding:6px 10px; border-right:1px solid var(--border-aged); border-bottom:1px solid var(--border-aged); }
  .of-meta div:nth-child(3n) { border-right:none; }
  .of-meta div:nth-child(n+4) { border-bottom:none; }
  .of-meta .of-lbl { font-size:8.5px; letter-spacing:.1em; color:var(--ink-soft); text-transform:uppercase; }
  .of-meta .of-val { font-size:13px; font-weight:600; }

  /* --- Grille principale 3 colonnes --- */
  .of-grid { display:grid; grid-template-columns:minmax(190px,.85fr) minmax(230px,1.05fr) minmax(230px,1.1fr); gap:12px; align-items:start; }
  @media (max-width:1000px){ .of-grid { grid-template-columns:1fr; } }
  .of-col { display:flex; flex-direction:column; gap:10px; }

  /* --- Pavés de caractéristiques --- */
  .of-abils { display:flex; flex-direction:column; gap:7px; }
  .of-ab { border:2px solid var(--ink); border-radius:10px; background:var(--card); text-align:center;
    padding:5px 4px 3px; position:relative; }
  .of-ab .nm { font-family:'Cinzel',serif; font-size:9.5px; letter-spacing:.1em; color:var(--ink-soft); text-transform:uppercase; }
  .of-ab .md { font-size:24px; font-weight:700; line-height:1.05; color:var(--ink); }
  .of-ab .sc { display:inline-block; border:2px solid var(--ink); border-radius:14px; background:var(--parchment);
    font-size:12px; font-weight:700; padding:1px 12px; margin-top:2px; }
  .of-ab .src { font-size:9px; color:var(--gold); margin-top:1px; min-height:11px; }

  /* --- Boîtes encadrées --- */
  .of-box { border:2px solid var(--ink); border-radius:10px; background:var(--card); padding:9px 11px; }
  .of-box > h5 { font-family:'Cinzel',serif; font-size:9.5px; letter-spacing:.11em; text-transform:uppercase;
    color:var(--ink-soft); text-align:center; margin:6px 0 0; padding-top:5px; border-top:1px solid var(--border-aged); }
  .of-box.tight { padding:7px 9px; }

  /* --- Lignes de compétences / JS --- */
  .of-line { display:flex; align-items:center; gap:6px; font-size:12px; padding:1.5px 0; }
  .of-dot { width:10px; height:10px; border-radius:50%; border:1.5px solid var(--ink); flex-shrink:0; }
  .of-dot.on { background:var(--ink); }
  .of-mod { min-width:26px; text-align:right; font-weight:700; font-variant-numeric:tabular-nums; }
  .of-sk { flex:1; }
  .of-sk .ab { font-size:10px; color:var(--ink-soft); }

  /* --- Bandeau CA / init / vitesse --- */
  .of-combat { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; }
  .of-shield { border:2px solid var(--ink); border-radius:10px; background:var(--card); text-align:center; padding:6px 4px; }
  .of-shield .v { font-size:22px; font-weight:700; line-height:1.1; }
  .of-shield .l { font-size:8.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-soft); }

  /* --- PV --- */
  .of-hp { border:2px solid var(--ink); border-radius:10px; background:var(--card); padding:8px 11px; text-align:center; }
  .of-hp .cap { font-size:8.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-soft); }
  .of-hp .big { font-size:30px; font-weight:700; line-height:1.1; }
  .of-hp .sub { border-top:1px solid var(--border-aged); margin-top:5px; padding-top:5px; font-size:11px; color:var(--ink-soft); }

  /* --- JS contre la mort --- */
  .of-death { display:flex; flex-direction:column; gap:4px; }
  .of-death .row { display:flex; align-items:center; gap:7px; font-size:11px; }
  .of-death .row span:first-child { width:52px; color:var(--ink-soft); text-transform:uppercase; letter-spacing:.06em; font-size:9px; }
  .of-bub { width:13px; height:13px; border-radius:50%; border:1.5px solid var(--ink); display:inline-block; cursor:pointer; }
  .of-bub.s { background:var(--crit-green); border-color:var(--crit-green); }
  .of-bub.f { background:var(--fail-red); border-color:var(--fail-red); }

  /* --- Tables attaques / sorts --- */
  .of-tbl { width:100%; border-collapse:collapse; font-size:11.5px; }
  .of-tbl th { font-family:'Cinzel',serif; font-size:8.5px; letter-spacing:.08em; text-transform:uppercase;
    color:var(--ink-soft); text-align:left; padding:3px 5px; border-bottom:1.5px solid var(--border-aged); font-weight:600; }
  .of-tbl td { padding:3px 5px; border-bottom:1px solid rgba(201,185,138,.45); vertical-align:top; }
  .of-tbl tr:last-child td { border-bottom:none; }
  .of-tbl .nm { font-weight:600; }
  .of-tbl .tr { font-size:10px; color:var(--gold); font-style:italic; }

  /* --- Zones de texte type feuille --- */
  .of-text { border:2px solid var(--ink); border-radius:10px; background:var(--card); padding:9px 11px; }
  .of-text h5 { font-family:'Cinzel',serif; font-size:9.5px; letter-spacing:.11em; text-transform:uppercase;
    color:var(--ink-soft); margin-bottom:5px; }
  .of-text p { font-size:12px; white-space:pre-wrap; line-height:1.45; }
  .of-sub { border-bottom:1px solid var(--border-aged); padding:4px 0; font-size:12px; }
  .of-sub:last-child { border-bottom:none; }
  .of-sub b { font-family:'Cinzel',serif; font-size:10px; letter-spacing:.06em; color:var(--blood); text-transform:uppercase; }

  /* --- Emplacements de sorts --- */
  .of-slots { display:flex; flex-wrap:wrap; gap:6px; }
  .of-slot { border:1.5px solid var(--ink); border-radius:7px; background:var(--parchment);
    padding:3px 9px; font-size:11px; }
  .of-slot b { font-family:'Cinzel',serif; font-size:10px; }

  .hp-btn { width:26px; height:26px; border-radius:50%; border:1.5px solid var(--ink); background:var(--parchment);
    font-size:16px; font-weight:700; line-height:1; cursor:pointer; color:var(--ink); flex-shrink:0; }
  .hp-btn:hover { background:var(--gold); color:#fff; border-color:var(--gold); }
  .of-pick { color:var(--blood); font-size:11.5px; font-weight:600; margin-top:2px; }
  .of-inp { width:100%; border:none; border-bottom:1px solid var(--border-aged); background:transparent;
    font-family:'Alegreya',serif; font-size:13px; font-weight:600; color:var(--ink); padding:1px 0; }
  .of-inp:focus { outline:none; border-bottom-color:var(--gold); }
  .of-area { width:100%; min-height:110px; border:none; background:transparent; resize:vertical;
    font-family:'Alegreya',serif; font-size:12px; line-height:1.45; color:var(--ink); }
  .of-area:focus { outline:none; }

  /* --- Export sur la fiche PDF officielle fournie --- */
  #pdf-template-export { display:none; }
  .pdf-template-page {
    position:relative; width:210mm; height:297mm; overflow:hidden; box-sizing:border-box;
    background-color:#fff; background-position:center; background-repeat:no-repeat; background-size:100% 100%;
    color:#111; font-family:Arial,Helvetica,sans-serif; print-color-adjust:exact; -webkit-print-color-adjust:exact;
  }
  .pdf-template-page + .pdf-template-page { break-before:page; page-break-before:always; }
  .pdf-value {
    position:absolute; z-index:2; box-sizing:border-box; overflow:hidden; color:#111;
    font-family:Arial,Helvetica,sans-serif; font-size:9pt; line-height:1.08;
    white-space:nowrap; text-overflow:ellipsis;
  }
  .pdf-value.center { text-align:center; font-weight:700; }
  .pdf-value.vcenter { display:flex; align-items:center; justify-content:center; }
  .pdf-value.big { font-size:16pt; font-weight:700; }
  .pdf-value.small { font-size:7.2pt; }
  .pdf-value.tiny { font-size:6.2pt; }
  .pdf-value.spell-row { font-size:7.2pt; line-height:1; }
  .pdf-value.block { white-space:pre-wrap; text-overflow:clip; line-height:1.18; }
  .pdf-value.labelled b { font-size:.94em; }
  .pdf-dot {
    position:absolute; z-index:3; width:1.05%; aspect-ratio:1; border-radius:50%; background:#111;
    transform:translate(-50%,-50%);
  }
  .pdf-portrait {
    position:absolute; z-index:1; object-fit:contain; object-position:center;
  }
  .pdf-preview-toolbar {
    position:sticky; z-index:10; top:10px; width:min(760px,calc(100% - 28px)); margin:0 auto 14px;
    display:flex; align-items:center; justify-content:space-between; gap:12px; box-sizing:border-box;
    padding:10px 14px; border-radius:9px; background:#f5edd8; border:1px solid #b99b54;
    box-shadow:0 3px 14px rgba(0,0,0,.28); font-family:'Alegreya',serif; color:#241b12;
  }
  .pdf-preview-toolbar .actions { display:flex; gap:8px; flex-wrap:wrap; justify-content:flex-end; }
  .pdf-preview-toolbar button {
    border:1px solid #6f1d1b; border-radius:6px; padding:7px 12px; cursor:pointer;
    background:#7f2522; color:#fff; font-family:'Cinzel',serif; font-size:11px;
  }
  .pdf-preview-toolbar button.secondary { background:#fffaf0; color:#4b3421; border-color:#b99b54; }
  body.template-previewing { background:#777 !important; margin:0 !important; padding:18px 0 !important; }
  body.template-previewing > :not(#pdf-template-export) { display:none !important; }
  body.template-previewing #pdf-template-export { display:block !important; }
  body.template-previewing .pdf-template-page {
    width:794px; height:1123px; margin:0 auto 18px; box-shadow:0 3px 18px rgba(0,0,0,.35);
  }

  @media print {
    .of-tabs { display:none !important; }
    .of-page { display:block !important; page-break-after:always; }
    body.template-printing { margin:0 !important; padding:0 !important; background:#fff !important; }
    body.template-printing > :not(#pdf-template-export) { display:none !important; }
    body.template-printing #pdf-template-export { display:block !important; }
    body.template-printing .pdf-preview-toolbar { display:none !important; }
    body.template-printing .pdf-template-page { display:block !important; margin:0 !important; }
    body.template-printing .pdf-template-page:last-child { break-after:auto; page-break-after:auto; }
  }

  @page { size:A4 portrait; margin:0; }
