* {
  box-sizing:border-box;
}

html {
  scroll-behavior:smooth;
}

body.study {
  margin:0;
  background:var(--paper,#fff);
  color:var(--ink,#171918);
  font-family:var(--body,Arial,Helvetica,sans-serif);
  font-size:16px;
  -webkit-font-smoothing:antialiased;
}

:where(h1,h2,h3,p,figure,dl,dd,fieldset) {
  margin:0;
}

a {
  color:inherit;
  text-decoration:none;
}

button,input,select,textarea {
  font:inherit;
}

button {
  color:inherit;
  cursor:pointer;
}

button:disabled {
  cursor:default;
}

:focus-visible {
  outline:3px solid var(--focus,#317ed1);
  outline-offset:5px;
}

img,svg {
  display:block;
  max-width:100%;
}

button[hidden],[hidden] {
  display:none!important;
}

.skip-link {
  position:absolute;
  z-index:8;
  left:12px;
  top:-80px;
  background:white;
  color:#111;
  padding:12px 18px;
}

.skip-link:focus {
  top:4px;
}

.example-rail {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  min-height:38px;
  padding:0 clamp(14px,3vw,44px);
  background:#f4f4ed;
  color:#34483e;
  border-bottom:1px solid #ccd3c9;
  font:500 11px/1.3 system-ui,sans-serif;
}

.example-rail a {
  padding:9px 0;
  font-weight:650;
}

.example-rail a:hover,.sample-footer a:hover,.mast-link:hover {
  text-decoration:underline;
  text-underline-offset:4px;
}

.example-rail>span {
  text-align:center;
}

.sample-mast {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  min-height:74px;
  padding:16px var(--side,6vw);
  border-bottom:1px solid var(--line,#7775);
}

.wordmark {
  display:inline-flex;
  align-items:center;
  gap:.4em;
  font-size:23px;
  font-weight:700;
  letter-spacing:-.065em;
}

.sample-mast>span,.eyeline,.micro,.sample-footer small {
  font:600 11px/1.4 ui-monospace,SFMono-Regular,Consolas,monospace;
  text-transform:uppercase;
  letter-spacing:.11em;
}

.sample-mast .mast-link {
  font-size:13px;
  font-weight:600;
  letter-spacing:0;
}

.mast-link span {
  margin-left:5px;
}

.eyeline {
  margin-bottom:14px;
}

.section-title h2 {
  font:inherit;
  font-size:clamp(36px,5vw,76px);
  line-height:1.01;
  letter-spacing:-.06em;
}

.section-title>p:last-child:not(.eyeline) {
  max-width:54ch;
  margin-top:17px;
  line-height:1.65;
}

.sample-footer {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  padding:36px var(--side,6vw);
  border-top:1px solid var(--line,#7775);
}

.sample-footer small {
  font-size:9px;
  letter-spacing:.12em;
}

.sample-footer p {
  font-size:clamp(20px,2.3vw,32px);
  margin-top:7px;
  letter-spacing:-.035em;
}

.sample-footer>a {
  border:1px solid currentColor;
  border-radius:32px;
  padding:13px 20px;
  font:600 13px/1.2 system-ui,sans-serif;
  text-align:center;
}

.study summary {
  cursor:pointer;
}

.study fieldset {
  padding:0;
  border:0;
  min-width:0;
}

.study legend {
  padding:0;
}

.reading {
  line-height:1.65;
  max-width:58ch;
}

.choice-line {
  display:flex;
  flex-wrap:wrap;
  gap:7px;
}

.choice-line button {
  min-height:40px;
  padding:7px 14px;
  background:transparent;
  border:1px solid currentColor;
  border-radius:30px;
  font-size:13px;
}

.choice-line button[aria-pressed=true] {
  background:var(--ink);
  color:var(--paper);
  border-color:var(--ink);
}

@media(max-width:650px) {
  .study {
    --side:5vw;
  }
  .sample-mast {
    min-height:57px;
    gap:10px;
  }
  .sample-mast>span {
    display:none;
  }
  .sample-footer {
    padding:27px 5vw;
    gap:14px;
  }
  .sample-footer>a {
    padding:12px 15px;
  }
  .example-rail {
    font-size:10px;
  }
  .example-rail>span {
    font-size:9px;
  }
  .section-title h2 {
    font-size:clamp(34px,9vw,58px);
  }
}

@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto;
  }
  *,*::before,*::after {
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
  }
}