
    :root{
      --ink:#0f172a;         /* slate-900 */
      --muted:#475569;       /* slate-600 */
      --accent:#2563eb;      /* blue-600 */
      --card:#ffffff;
      --bg:#f8fafc;          /* slate-50 */
      --ring:rgba(37,99,235,.2);
    }
    html,body{margin:0;padding:0;background:var(--bg);color:var(--ink);font:16px/1.6 system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial;}
    .wrap{max-width:960px;margin:auto;padding:2rem 1rem;}
    header h1{margin:.25rem 0 0;font-size:clamp(1.4rem,2.5vw,2rem);}
    header p{margin:.25rem 0 1.25rem;color:var(--muted)}
    .card{
      background:var(--card);
      border:1px solid #e5e7eb;
      border-radius:14px;
      padding:1.25rem 1.25rem 0.5rem;
      box-shadow:0 1px 0 rgba(0,0,0,.03), 0 10px 30px -20px rgba(2,6,23,.35);
    }
    h2{font-size:1.15rem;margin:0 0 .5rem;color:var(--accent)}
    .grid{
      display:grid; gap:.75rem;
      grid-template-columns:repeat(2,minmax(0,1fr));
    }
    @media (max-width:720px){
      .grid{grid-template-columns:1fr}
    }
    .ex{
      border:1px solid #e5e7eb; border-radius:12px;
      padding:.9rem .95rem; background:#fff;
    }
    .ex h3{
      margin:0 0 .35rem; font-size:1rem; font-weight:700; color:var(--ink);
    }
    .ex ol{margin:.25rem 0 .25rem 1.25rem; padding:0}
    .ex li{margin:.2rem 0 .2rem .2rem}
    .note{font-size:.95rem; color:var(--muted); margin:.2rem 0 .8rem}
    .answer-line{
      display:inline-block; min-width:7ch; border-bottom:1.5px dotted #94a3b8; transform:translateY(-2px);
    }
    .target{
      display:inline-block; padding:.1rem .5rem; border-radius:8px; background:#eef2ff; border:1px solid #c7d2fe; color:#3730a3; font-weight:600;
    }
    .foot{color:var(--muted); font-size:.9rem; margin-top:1rem}
    /* Print tweaks */
    @media print{
      body{background:#fff}
      .card{box-shadow:none}
      .wrap{padding:0}
      .ex{break-inside:avoid}
      a[href]:after{content:""}
    }
 
    .highlight {
  background: #fef9c3;        /* soft yellow background */
  border: 2px solid #facc15;  /* golden border */
  border-radius: 10px;
  padding: 0.8rem 1rem;
  margin: 1rem 0;
  font-size: 1.05rem;
  font-weight: 700;           /* all text bold */
  color: #78350f;             /* dark golden brown text */
  box-shadow: 0 3px 6px rgba(0,0,0,0.1);
}
/* Put near the other answer-line styles */
.answer-wide { min-width: 40ch; }

details.ex { padding: 1rem; }          /* same padding as .ex boxes */
details.ex summary { cursor: pointer; font-weight: 700; }


.solutions-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
  gap: 0.5rem 1rem;
  margin-top: 1rem;
}
.solutions-grid div {
  padding: 0.2rem 0.4rem;
}

.ex.ex-wide li {
  margin: 1.5rem 0;
}
