/* source: faerdighed\ligninger\etx.htm style block 1 */
:root{
      --bg: #eaf3ff;
      --card: #ffffff;
      --ink: #0a0a0a;
      --muted: #5b6472;
      --btn: #2b2a6d;      /* mørklilla som på billedet */
      --btnText: #ffffff;
      --btnHover: #3a3991;
      --solBg: #e6f3ff;    /* lys blå løsning */
      --border: #d9e0ea;
      --shadow: 0 8px 24px rgba(0,0,0,.12);
      --radius: 16px;
    }
    /* Sidebaggrund + overskrift */
    body{
      font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial;
      background: var(--bg);
      color: var(--ink);
      margin: 0;
      padding: 28px 16px 40px;
    }
    h1{
      text-align: center;
      font-size: clamp(28px, 5vw, 44px);
      font-weight: 800;
      margin: 0 0 18px;
      letter-spacing:.3px;
      color:#2f3266;
    }

    /* Kort / panel */
    .card{
      max-width: 820px;
      margin: 0 auto;
      background: var(--card);
      border-radius: 20px;
      box-shadow: var(--shadow);
      padding: 24px 24px 18px;
      border: 1px solid #e7e9f0;
    }
    .lead{ text-align:center; color: var(--muted); margin-bottom: 10px; }

    .equation{
      text-align:center;
      font-size: clamp(22px, 3.6vw, 32px);
      margin: 4px 0 10px;
    }

    /* Knapper */
    .btn-row{
      display:flex; flex-wrap:wrap; justify-content:center; gap:12px;
      margin: 8px 0 14px;
    }
    button{
      font: inherit;
      padding: 10px 16px;
      border-radius: 10px;
      border: none;
      color: var(--btnText);
      background: var(--btn);
      cursor: pointer;
      box-shadow: 0 2px 0 rgba(0,0,0,.08);
      transition: transform .03s ease, background .15s ease;
    }
    button:hover{ background: var(--btnHover); }
    button:active{ transform: translateY(1px); }

    /* Løsning */
    .solution {
  display:none;
  margin-top: 6px;
  padding: 10px 14px;
  border-radius: 12px;
  background: var(--solBg);
  border: 1px solid #cfe5ff;
  line-height: 0,5;           /* gør linjeafstanden tættere */
}

.solution mjx-container {
  margin: 0.2em 0 !important; /* reducer afstand mellem MathJax-linjer */
}

    /* Diskret bund */
    .footer-note{
      text-align:center; color:#7a8493; font-size: 13px; margin-top: 12px;
    }