:root {
  --ground:#4b544e;
  --ground-deep:#3a423d;
  --ground-elevated:#57625b;
  --ground-border:rgba(244, 246, 244, 0.16);
  --ground-border-subtle:rgba(244, 246, 244, 0.08);
  --ground-border-strong:rgba(244, 246, 244, 0.32);
  --chalk:#f4f6f4;
  --chalk-muted:#c5cbc6;
  --chalk-subtle:#c2cac4;
  --accent:#f0e39c;
  --accent-subtle:rgba(232, 217, 140, 0.14);
  --accent-glow:rgba(232, 217, 140, 0.32);


  --lugu-7b8:"Cormorant Garamond", Georgia, "Times New Roman", serif;
  --lugu-047:"Spectral", Charter, "Times New Roman", serif;
  --lugu-43e:'JetBrains Mono', Consolas, Monaco, monospace;


  --sidebar-w:320px;
  --header-mobile-h:68px;


  --step--2:clamp(0.72rem, 0.70rem + 0.10vw, 0.80rem);
  --step--1:clamp(0.85rem, 0.82rem + 0.16vw, 0.95rem);
  --lugu-36f:clamp(1.00rem, 0.96rem + 0.22vw, 1.125rem);
  --lugu-ddd:clamp(1.20rem, 1.13rem + 0.38vw, 1.42rem);
  --lugu-4a2:clamp(1.44rem, 1.32rem + 0.62vw, 1.80rem);
  --lugu-645:clamp(1.78rem, 1.58rem + 1.00vw, 2.32rem);
  --lugu-b4c:clamp(2.18rem, 1.88rem + 1.52vw, 3.02rem);
  --lugu-751:clamp(2.65rem, 2.22rem + 2.22vw, 4.00rem);


  --space-3xs:clamp(0.25rem, 0.22rem + 0.12vw, 0.35rem);
  --space-2xs:clamp(0.45rem, 0.40rem + 0.22vw, 0.60rem);
  --space-xs:clamp(0.75rem, 0.70rem + 0.30vw, 0.95rem);
  --space-s:clamp(1.00rem, 0.92rem + 0.40vw, 1.25rem);
  --space-m:clamp(1.50rem, 1.35rem + 0.75vw, 2.00rem);
  --space-l:clamp(2.00rem, 1.80rem + 1.10vw, 2.75rem);
  --space-xl:clamp(3.00rem, 2.65rem + 1.80vw, 4.25rem);
  --space-2xl:clamp(4.25rem, 3.75rem + 2.60vw, 6.00rem);
  --space-3xl:clamp(5.50rem, 4.80rem + 3.60vw, 8.00rem);


  --ease-refine:cubic-bezier(0.16, 1, 0.3, 1);
  --dur-fast:160ms;
  --dur-base:240ms;
  --dur-deliberate:480ms;
  --dur-settle:720ms;


  --content-max:860px;
  --spread-max:1140px;
  --gutter:clamp(1.25rem, 0.95rem + 1.5vw, 2.50rem);
}


*, *::before, *::after {
  box-sizing:border-box;
}


html {
  background-color:var(--ground);
  color:var(--chalk);
  font-family:var(--lugu-047);
  font-size:100%;
  line-height:1.62;
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  scroll-behavior:smooth;
  scroll-padding-top:calc(var(--header-mobile-h) + 1.5rem);
}


body {
  margin:0;
  padding:0;
  background-color:var(--ground);
  color:var(--chalk);
  min-height:100vh;
  overflow-x:hidden;
  position:relative;
}


img, picture, svg, video {
  display:block;
  max-width:100%;
  height:auto;
}


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


a {
  color:var(--chalk);
  text-decoration:underline;
  text-decoration-thickness:1px;
  text-underline-offset:3px;
  text-decoration-color:var(--ground-border);
  transition:color var(--dur-fast) var(--ease-refine), text-decoration-color var(--dur-fast) var(--ease-refine);
}


a:hover {
  color:var(--accent);
  text-decoration-color:var(--accent);
}


a:focus-visible {
  outline:2px solid var(--accent);
  outline-offset:3px;
  text-decoration:none;
}


h1, h2, h3, h4, h5, h6 {
  font-family:var(--lugu-7b8);
  font-weight:600;
  line-height:1.15;
  color:var(--chalk);
  margin-top:0;
  margin-bottom:var(--space-s);
  letter-spacing:-0.015em;
  overflow-wrap:break-word;
  word-wrap:break-word;
  hyphens:auto;
}


h1 {
  font-size:var(--lugu-751);
  font-weight:600;
  letter-spacing:-0.025em;
  line-height:1.08;
}


h2 {
  font-size:var(--lugu-b4c);
  font-weight:600;
  letter-spacing:-0.02em;
  line-height:1.12;
}


h3 {
  font-size:var(--lugu-645);
  font-weight:600;
  line-height:1.18;
}


h4 {

  font-size:var(--lugu-4a2);
  font-weight:600;
  line-height:1.22;
}


h5 {
  font-size:var(--lugu-ddd);
  font-weight:600;
  line-height:1.30;
}


h6 {
  font-size:var(--lugu-36f);
  font-weight:600;
  line-height:1.35;
}


p {
  margin-top:0;
  margin-bottom:var(--space-m);
  color:var(--chalk);
  font-size:var(--lugu-36f);
  line-height:1.68;
}


p.lead {
  font-size:var(--lugu-ddd);
  line-height:1.55;
  color:var(--chalk);
  letter-spacing:-0.005em;
}


p.meta, .meta-text {
  font-family:var(--lugu-43e);
  font-size:var(--step--1);

  color:var(--chalk-muted);
  letter-spacing:0.02em;
}


blockquote {
  margin:var(--space-l) 0;
  padding-left:var(--space-m);
  border-left:2px solid var(--accent);
  font-style:italic;
  color:var(--chalk);
  font-size:var(--lugu-ddd);
}


hr {
  border:0;
  height:1px;
  background-color:var(--ground-border);
  margin:var(--space-xl) 0;
}


ul, ol {
  padding-left:var(--space-m);
  margin-top:0;
  margin-bottom:var(--space-m);
}


li {
  margin-bottom:var(--space-2xs);

  line-height:1.60;
}


code, kbd, samp {
  font-family:var(--lugu-43e);
  font-size:0.9em;
  background-color:var(--ground-deep);
  border:1px solid var(--ground-border);
  padding:0.12em 0.35em;
  border-radius:2px;
  color:var(--accent);
}


pre {
  font-family:var(--lugu-43e);
  font-size:var(--step--1);
  background-color:var(--ground-deep);
  border:1px solid var(--ground-border);
  padding:var(--space-m);
  overflow-x:auto;
  line-height:1.5;
  color:var(--chalk);
}


.skip-link {
  position:absolute;
  top:-100px;
  left:1rem;
  z-index:9999;
  background-color:var(--accent);
  color:var(--ground-deep);
  padding:0.75rem 1.25rem;
  font-family:var(--lugu-43e);
  font-size:var(--step--1);
  font-weight:500;
  text-decoration:none;
  border:1px solid var(--chalk);
  transition:top var(--dur-fast) var(--ease-refine);
}


.skip-link:focus {
  top:1rem;
  outline:2px solid var(--chalk);
  outline-offset:2px;
}


.screen-reader-only,
.visually-hidden {
  position:absolute !important;
  width:1px !important;
  height:1px !important;
  padding:0 !important;
  margin:-1px !important;
  overflow:hidden !important;
  clip:rect(0, 0, 0, 0) !important;
  white-space:nowrap !important;
  border:0 !important;
}


.icon {
  width:1.15em;
  height:1.15em;
  display:inline-block;
  fill:currentColor;
  stroke:none;
  vertical-align:-0.15em;
  flex-shrink:0;
}


.lockup-headline {
  position:relative;
  display:block;
  margin-bottom:var(--space-l);
}


.lockup-headline .lockup-primary {
  display:block;
  font-size:var(--lugu-751);
  font-family:var(--lugu-7b8);
  font-weight:600;
  line-height:1.05;
  letter-spacing:-0.025em;
  color:var(--chalk);
}


.lockup-headline .lockup-divider {
  display:block;
  position:relative;
  height:1px;
  background-color:var(--ground-border);
  margin:var(--space-2xs) 0;
}


.lockup-headline .lockup-divider::after {
  content:'';
  position:absolute;
  left:0;
  top:-1px;
  width:48px;
  height:3px;
  background-color:var(--accent);
}


.lockup-headline .lockup-offset {
  display:block;
  font-size:var(--lugu-b4c);
  font-family:var(--lugu-7b8);
  font-style:italic;
  font-weight:400;
  line-height:1.12;
  color:var(--chalk-muted);
  padding-left:clamp(1.5rem, 1rem + 3vw, 4.5rem);
}


.lockup-headline--sub {
  margin-top:var(--space-xl);
  margin-bottom:var(--space-m);
}


.lockup-headline--sub .lockup-primary {
  font-size:var(--lugu-645);
  font-weight:600;
}


.lockup-headline--sub .lockup-offset {
  font-size:var(--lugu-4a2);
  padding-left:clamp(1rem, 0.8rem + 2vw, 2.5rem);
}


.editorial-layout {
  display:flex;
  min-height:100vh;
  width:100%;
}


.editorial-content-column {
  flex:1 1 0%;
  min-width:0;
  position:relative;
  background-color:var(--ground);
}


.essay-container {
  width:100%;
  max-width:var(--content-max);
  margin-left:auto;
  margin-right:auto;
  padding-left:var(--gutter);
  padding-right:var(--gutter);
}


.spread-container {
  width:100%;
  max-width:var(--spread-max);
  margin-left:auto;
  margin-right:auto;
  padding-left:var(--gutter);
  padding-right:var(--gutter);
}


.full-measure {
  width:100%;
  margin-left:0;
  margin-right:0;
}


@media (max-width: 1023px) {
  .editorial-layout {
    display:block;
    padding-top:calc(var(--header-mobile-h) + 1.5rem);
  }
}
@media (min-width: 1024px) {
  .mobile-top-bar {
    display:none !important;
  }
}


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