/* Scoped additions; the Scientific Method page owns the surrounding experience. */
.sm-unit-scope { margin: 1rem 0 .5rem; font-weight: 700; }
.sm-unit-links { display: flex; flex-wrap: wrap; gap: .6rem; margin: 1rem 0 1.5rem; }
.sm-unit-links a { padding: .55rem .8rem; border: 1px solid currentColor; border-radius: .5rem; font-weight: 700; text-decoration: none; }
.sm-unit-links a:hover { background: var(--sand-200, #e8dfc7); }
.sm-unit-links a:focus-visible, .sm-measure :is(a, summary, input, select):focus-visible { outline: 3px solid #5b54d6; outline-offset: 4px; }
.sm-measure { color: var(--ink-900, #0d0d11); background: var(--sand-100, #faf6eb); }
.sm-measure :is(section, details, h3) { scroll-margin-top: 6rem; }
.sm-measure h2 { font-size: clamp(1.6rem, 3vw, 2.5rem); }
.sm-measure h3 { margin: .5rem 0; }
.sm-measure p { line-height: 1.65; margin: .7rem 0; }
.sm-measure a { color: #4942b4; text-underline-offset: .2em; }
.sm-measure li { margin: .45rem 0; line-height: 1.6; }
.sm-measure :is(ul, ol) { padding-left: 1.4rem; }
.sm-measure .mg-reading { margin: 1rem 0; border: 1px solid #c8bda1; border-radius: .6rem; overflow-wrap: anywhere; }
.sm-measure summary { padding: 1rem; cursor: pointer; font-weight: 700; }
.sm-measure .mg-reading > div, .sm-measure .mg-reading > p { padding: 0 1rem 1rem; }
.sm-measure-block { margin: 2rem 0; padding: 1.5rem 0; border-top: 1px solid #c8bda1; }
.sm-measure .mg-two, .sm-measure .metric-grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 1.5rem; }
.sm-measure .sm-tools { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.sm-measure .sm-tools article, .sm-measure .mg-callout, .sm-measure .conv-panel { padding: 1.2rem; border-radius: .6rem; background: #f0e8d5; }
.sm-measure .ladder { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem; margin: 1rem 0; }
.sm-measure .ladder-step { font-weight: 700; padding: .35rem; background: #e0d6bf; border-radius: .2rem; }
.sm-measure .ladder i { font-size: .7rem; font-style: normal; }
.sm-measure .mnemonic { font-size: .9rem; }
.sm-measure .conv-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.sm-measure .builder-label { display: block; margin: .6rem 0 .3rem; color: #423e37; }
.sm-measure :is(input, select) { box-sizing: border-box; width: 100%; min-width: 0; padding: .75rem; background: #fffdf6; color: #0d0d11; border: 1px solid #8d8167; border-radius: .3rem; font: inherit; }
.sm-measure .conv-result { font-size: 1.25rem; font-weight: 700; overflow-wrap: anywhere; }
.sm-measure .sm-table-scroll { overflow-x: auto; }
.sm-measure table { border-collapse: collapse; width: 100%; margin: .75rem 0; }
.sm-measure :is(th, td) { border: 1px solid #b6aa8d; padding: .5rem; text-align: left; }
.sm-measure caption { text-align: left; font-weight: 700; margin-bottom: .5rem; }
#measurement-watch, #measurement-sketch, #graph-sketchnotes { margin: 1.5rem 0 1rem; scroll-margin-top: 6rem; }
@media (max-width: 700px) {
  .sm-measure .mg-two, .sm-measure .metric-grid, .sm-measure .sm-tools { grid-template-columns: minmax(0, 1fr); }
  .sm-unit-links { font-size: .9rem; }
}
@media print {
  .sm-unit-links { display: none; }
  .sm-measure { background: white; color: black; }
  .sm-measure :is(.mg-two, .metric-grid, .sm-tools) { display: block; }
  .sm-measure .mg-reading { break-inside: avoid; }
}
