#inside-the-magnet{scroll-margin-top:24px}
#inside-the-magnet .mn-intro{max-width:950px}
#inside-the-magnet .mn-controls{display:grid;grid-template-columns:1.15fr 1fr;gap:18px;margin:20px 0}
#inside-the-magnet select{width:100%;min-height:44px;padding:10px;color:var(--ink);background:#0a171d;border:1px solid #4d626b;border-radius:6px}
#inside-the-magnet input[type=range]{width:100%;min-height:32px;accent-color:var(--teal)}
#inside-the-magnet select:focus-visible{outline:3px solid var(--teal);outline-offset:3px}
#inside-the-magnet .mn-drawing{margin:0;border:1px solid var(--line);border-radius:8px;background:#0a171d;padding:12px 16px}
#inside-the-magnet svg{display:block;width:100%;height:auto;max-height:265px}
#inside-the-magnet figcaption{font-size:13px;line-height:1.5;color:var(--muted)}
#inside-the-magnet .mn-time-field{margin-top:16px}
#inside-the-magnet .mn-description{min-height:3.2em;color:#dce9ed;font-size:14px;line-height:1.6}
#inside-the-magnet .mn-notes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin-top:24px}
#inside-the-magnet .mn-notes p{font-size:14px}
#inside-the-magnet output{font-variant-numeric:tabular-nums}
#inside-the-magnet .mn-small{font-size:13px}
@media(max-width:760px){#inside-the-magnet .mn-notes{grid-template-columns:1fr;gap:6px}#inside-the-magnet .mn-controls{grid-template-columns:1fr}#inside-the-magnet .mn-drawing{padding:10px 6px}#inside-the-magnet .mn-description{min-height:0}}
@media print{#inside-the-magnet .mn-controls,#inside-the-magnet .mn-time-field,#inside-the-magnet .actions{display:none}}
