/* Layout and painting only. MonogramMotion owns settings and all motion. */
.lm {
  --lm-size: 41px;
  --lm-ink: #141413;
  --lm-bg: #f1eee6;
  --lm-stroke-cur: 0px;
  --lm-letter-stroke-cur: 0px;
  display: inline-block;
  position: relative;
  isolation: isolate;
  white-space: nowrap;
  font-family: var(--lm-font, "Noto Serif"), Georgia, "Times New Roman", serif;
  font-weight: var(--lm-weight, 700);
  font-size: var(--lm-size);
  line-height: 1;
  letter-spacing: var(--lm-tracking, 0em);
  color: var(--lm-ink);
  user-select: none;
  -webkit-tap-highlight-color: transparent;
  contain: layout style;
  overflow: visible;
  transform: translateZ(0);
  will-change: width;
}
.lm-l {
  display: inline-block;
  position: relative;
  z-index: 2;
  backface-visibility: hidden;
  transform: translate3d(0, 0, 0);
  will-change: transform, opacity;
}
.lm-l[data-space] { width: 0.28em; }
.lm-outline-clone {
  display: inline-block;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
  font: inherit;
  letter-spacing: inherit;
  line-height: inherit;
  color: transparent;
  -webkit-text-stroke: var(--lm-stroke-cur) var(--lm-bg);
  paint-order: stroke fill;
  pointer-events: none;
  user-select: none;
  backface-visibility: hidden;
  will-change: transform;
}
.lm-outline-clone[data-for="a"] { z-index: 1; }
.lm-l[data-keep="s"] { z-index: 3; }
.lm-l[data-keep="a"] { z-index: 4; }
.lm-l[data-keep] {
  -webkit-text-stroke: var(--lm-letter-stroke-cur) var(--lm-bg);
  paint-order: stroke fill;
}
.js.is-cold-start .lm[data-logo-mark][data-ready] {
  animation: lm-ready-fade 260ms cubic-bezier(0.72, 0, 0.16, 1) both;
}
@keyframes lm-ready-fade { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
  .js.is-cold-start .lm[data-logo-mark][data-ready] { animation-duration: 1ms; }
}
