/* source: faerdighed\statistik\hyppighed_A4.htm style block 1 */
:root{ --gap:14px; --pad:10px; }
  body{ font-family: ui-sans-serif, system-ui, Segoe UI, Arial; margin:0; padding:clamp(10px,2vw,22px); background:#f7f8fb; color:#111; }
  header{ display:flex; gap:10px; align-items:center; margin-bottom:12px; flex-wrap:wrap; }
  h1{ font-size:clamp(18px,2.2vw,26px); margin:0 12px 0 0; }
  .controls{ display:flex; flex-wrap:wrap; gap:8px; }
  button{ font:inherit; padding:8px 12px; border-radius:10px; border:1px solid #cfd3d8; background:#fff; cursor:pointer; box-shadow:0 1px 1px rgba(0,0,0,.05); }
  button:hover{ background:#eef4ff; }

  main{ background:#fff; border:1px solid #e5e7ec; border-radius:12px; padding:12px; }

  .task{
    border:1px solid #dfe3e9; border-radius:10px; padding:var(--pad);
    background:#fafbff; display:flex; flex-direction:column; gap:var(--gap);
    max-width: 100%;
  }
  .title{ font-weight:700; color:#334; margin-bottom:6px; }

  .row{ display:grid; grid-template-columns: 1fr 1fr; gap: var(--gap); }
  .card{ background:#fff; border:1px solid #e5e7ec; border-radius:10px; padding:10px; }
  .data{ display:flex; flex-wrap:wrap; gap:8px; }
  .chip{ padding:6px 10px; border-radius:999px; border:1px solid #dfe3e9; background:#fff; font-size:0.95rem; }

  table{ border-collapse:collapse; width:100%; font-size:0.95rem; }
  th,td{ border:1px solid #e5e7ec; padding:6px 8px; text-align:center; }
  th{ background:#f6f7fb; }

  .axes{ width:100%; height:260px; background:#fff; border:1px solid #e4e6ee; border-radius:8px; }
  .axesPct{ width:100%; height:220px; background:#fff; border:1px solid #e4e6ee; border-radius:8px; }

  .answer{ display:none; color:#0b69a3; font-size:0.95rem; }
  .answer.shown{ display:block; }

  .notes{ height:120px; border:1px solid #e4e6ee; border-radius:8px; background:#fff; }

  @page { size: A4; margin: 10mm; }
  @media print{
    header{ display:none !important; }
    body{ padding:0; background:#fff; }
    main{ border:none; padding:0 8mm; }

    .task, .card{ break-inside:avoid; page-break-inside:avoid; }
    .row{ grid-template-columns: 1fr 1fr; gap:10px; }
    .axes{ height:230px; }
    .axesPct{ height:200px; }
    .notes{ height:150px; }
    .answer{ display:none !important; }
    #facitPrint{ display:block; page-break-before: always; }
  }


