/* source: faerdighed\ligninger\flerex.htm style block 1 */
:root{
      --bg: #eaf3ff;
      --card: #ffffff;
      --ink: #0a0a0a;
      --muted: #5b6472;
      --btn: #2b2a6d;
      --btnText: #ffffff;
      --btnHover: #3a3991;
      --solBg: #e6f3ff;
      --shadow: 0 8px 24px rgba(0,0,0,.12);
    }
    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;
    }
    .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; }

    .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); }

    .solution{
      display:none;
      margin-top: 6px;
      padding: 8px 8px;
      border-radius: 12px;
      background: var(--solBg);
      border: 1px solid #cfe5ff;
    
  text-align: center;
}

    /* Centrer display-math i MathJax */
    .solution mjx-container[jax="CHTML"][display="true"] { text-align: center !important; }