/* source: faerdighed\funktioner\retlinje_A4.htm style block 1 */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:wght@400;700&display=swap');
  :root{
    --grid-gap: 14px;
    --tile-pad: 10px;
    --canvas: 360px; /* lærredets side */
  }
  body{
    font-family:"Noto Sans",system-ui,Segoe UI,Arial;
    margin:0; padding: clamp(10px,2vw,22px);
    background:#f7f8fb; color:#111;
  }
  header{ display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-bottom:12px; }
  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; }

  .grid{
    display:grid; grid-template-columns: 1fr 1fr; gap: var(--grid-gap);
  }

  .task{
    border:1px solid #dfe3e9; border-radius:10px; padding: var(--tile-pad);
    display:flex; flex-direction:column; gap:8px; background:#fafbff;
  }
  .title{ font-weight:700; color:#334; }
  .prompt{ font-size:0.95rem; color:#333; min-height:2lh; }
  .canvas-wrap{ display:flex; justify-content:center; }
  canvas{
    background:#fff; border:1px solid #333; border-radius:6px;
    width:100%; max-width:var(--canvas); aspect-ratio:1/1;
  }
  .answer{ display:none; color:#0b69a3; font-size:0.95rem; }
  .answer.shown{ display:block; }

  .print-heading, .print-heading-facit{ display:none; }

  #facitPrint{ display:none; }
  .page-break{ page-break-before: always; }
  .facit-list{ margin:10px 0 0 18px; }

  /* facit-gitter på printsiden */
  .grid-facit{
    display:grid; grid-template-columns: 1fr 1fr; gap: var(--grid-gap);
    margin-top:10px;
  }
  .facit-card{
    border:1px solid #dfe3e9; border-radius:10px; padding: var(--tile-pad);
    background:#fff; display:flex; flex-direction:column; gap:8px;
  }
  .facit-eq{ color:#0b69a3; }

  @media print{
    header{ display:none !important; }
    body{ padding:0; background:#fff; }
    main{ border:none; padding:0 8mm; }
    .print-heading, .print-heading-facit{
      display:block; text-align:center; font-weight:700; font-size:18px; margin: 8mm 0 5mm;
    }
    .answer{ display:none !important; }
  }