/* source: print\arealberegninger.htm style block 1 */
:root {
    --border: #cfcfcf;
    --pane-height: 50mm;   /* 10 tern á 5 mm */
  }
  * { box-sizing: border-box; }
  body {
    font-family: Arial, sans-serif;
    margin: 20px;
    color: #111;
    -webkit-print-color-adjust: exact;
            print-color-adjust: exact;
    background:#fff;
  }
  h1 {
    text-align: center;
    margin: 0 0 10px;
    font-size: 26px; /* lidt mindre */
  }
  .controls {
    display: flex;
    gap: 10px;
    justify-content: center;
    margin-bottom: 14px;
  }
  button {
    font-size: 15px;
    padding: 7px 12px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: #f6f6f6;
    cursor: pointer;
  }

  /* Ark og opgavebokse */
  .sheet {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px; /* lidt mindre lodret afstand */
    max-width: 980px;
    margin: 0 auto;
  }
  .task {
    display: grid;
    grid-template-columns: 1.1fr 1fr 1fr; /* venstre: tekst • midten: figur • højre: tern-felt */
    gap: 8px;
    border: 1.5px solid var(--border);
    border-radius: 10px;
    padding: 8px;          /* strammere padding */
    page-break-inside: avoid;
    align-items: center;   /* centrér lodret i alle tre kolonner */
    background:#fff;
  }
  .task h2 { margin: 0 0 4px; font-size: 18px; }
  .given { font-size: 16px; line-height: 1.45; }
  .instr { margin-top: 4px; font-weight: bold; font-size: 16px; }

  /* Midterkolonne: figur centreret */
  .sketch-wrap {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: var(--pane-height);
  }
  .sketch {
    width: 100%;
    height: var(--pane-height); /* matcher højden på tern-feltet */
  }
  .lbl { font: 11px Arial, sans-serif; fill: #000; }

  /* Højre kolonne: ternet felt (5 mm) med kraftigere hver 25 mm */
  .calc-grid {
    width: 100%;
    height: var(--pane-height);
    border: 1px solid #bdbdbd;
    border-radius: 8px;
    background: #fff;
    background-image:
      linear-gradient(to right, rgba(0,0,0,0.35) 1px, transparent 1px),
      linear-gradient(to bottom, rgba(0,0,0,0.35) 1px, transparent 1px),
      linear-gradient(to right, rgba(0,0,0,0.60) 1px, transparent 1px),
      linear-gradient(to bottom, rgba(0,0,0,0.60) 1px, transparent 1px);
    background-size:
      5mm 5mm, 5mm 5mm, 25mm 25mm, 25mm 25mm;
    background-position: 0 0, 0 0, 0 0, 0 0;
  }
  /* Fallback hvis mm-enheder driller på skærm */
  @supports not (background-size: 5mm 5mm) {
    .calc-grid {
      background-size: 19px 19px, 19px 19px, 95px 95px, 95px 95px;
    }
  }

  /* Printoptimering */
  @page { size: A4 portrait; margin: 10mm; }
  @media print {
    .controls { display: none; }
    body { margin: 0; }
    h1 { font-size: 20px; margin: 0 0 6px; }
    .sheet { gap: 8px; }
    .task {
      gap: 6px;
      padding: 6px;
      border-width: 1px;
    }
    .task h2 { font-size: 16px; }
    .given, .instr { font-size: 15px; }
  }