.chapter-menu--shared {
  position: fixed; inset: 0; width: 100%; max-width: none; height: 100dvh; max-height: none;
  margin: 0; padding: clamp(1.2rem, 2.8vw, 3rem) clamp(1.2rem, 4vw, 4.5rem);
  color: #f9fcf4; background: #272727; border: 0; overflow: auto; overscroll-behavior: contain;
}
.chapter-menu--shared::backdrop { background: transparent; }
.chapter-menu--shared .chapter-menu__surface { width: min(100%, 110rem); min-height: 100%; margin: 0 auto; }
.chapter-menu--shared .chapter-menu__top { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.chapter-menu--shared .chapter-menu__top span { font-size: clamp(1.45rem, 2.6vw, 2.7rem); font-weight: 800; letter-spacing: -.05em; }
.chapter-menu--shared .chapter-menu__top em { color: #ff9ab6; font-style: normal; }
.chapter-menu--shared .chapter-menu__top button {
  display: grid; place-items: center; width: 3.4rem; height: 3.4rem; min-width: 3.4rem; min-height: 3.4rem;
  padding: 0; color: #202840; background: #f9fcf4; border: 0; border-radius: 50%;
  font: inherit; font-size: 2rem; line-height: 1; cursor: pointer;
}
.chapter-menu--shared .chapter-menu__layout {
  display: grid; grid-template-columns: minmax(0, .45fr) minmax(0, .55fr);
  gap: clamp(2rem, 5vw, 7rem); align-items: stretch; min-height: calc(100dvh - 8rem);
}
.chapter-menu--shared .chapter-menu__portrait { position: relative; align-self: end; height: min(78dvh, 860px); }
.chapter-menu--shared .chapter-menu__portrait img { display: block; width: 100%; height: 100%; object-fit: contain; object-position: center bottom; }
.chapter-menu--shared .chapter-menu__bubble {
  position: absolute; z-index: 1; top: 7%; right: -4%; padding: 1.05rem 1.35rem;
  color: #202840; background: #f9fcf4; font-size: clamp(1rem, 1.4vw, 1.4rem);
  font-weight: 850; line-height: 1.25; transform: rotate(5deg);
  clip-path: polygon(0 0, 95% 0, 100% 8%, 97% 86%, 35% 87%, 18% 100%, 20% 87%, 0 89%);
}
.chapter-menu--shared .chapter-menu__body { align-self: center; padding: 2rem 0 4rem; }
.chapter-menu--shared .chapter-menu__body h2 {
  margin: 0 0 2rem; color: #f9fcf4; font-size: clamp(2.8rem, 4.3vw, 5.8rem);
  font-weight: 800; line-height: 1.12; letter-spacing: -.075em;
}
.chapter-menu--shared .chapter-menu__body h2 em { color: #ff9ab6; font-style: normal; }
.chapter-menu--shared nav { display: block; width: 100%; margin: 0; }
.chapter-menu--shared nav a {
  display: grid; grid-template-columns: 4.3rem 1fr; gap: .8rem; align-items: center;
  width: 100%; min-height: clamp(4.7rem, 9vh, 7.8rem); color: #f9fcf4;
  border: 0; font-size: inherit; font-weight: inherit; line-height: inherit; letter-spacing: normal;
  text-decoration: none; transition: color 170ms ease, padding-left 170ms ease, background 170ms ease;
}
.chapter-menu--shared nav a:last-child { border: 0; }
.chapter-menu--shared nav a small { color: #ff9ab6; font-size: 1.5rem; font-weight: 800; letter-spacing: .08em; }
.chapter-menu--shared nav a strong { font-size: clamp(2rem, 3.35vw, 4.1rem); font-weight: 780; letter-spacing: -.065em; }
.chapter-menu--shared nav a[aria-current="page"] strong,
.chapter-menu--shared nav a:hover { color: #ff9ab6; }
.chapter-menu--shared nav a[aria-current="page"] strong::after { content: none; }
.chapter-menu--shared nav a:hover { padding-left: .7rem; background: rgba(255,154,182,.055); }
.chapter-menu--shared .chapter-menu__contact { display: grid; grid-template-columns: auto 1fr; gap: .4rem 1rem; align-items: center; margin-top: 2rem; }
.chapter-menu--shared .chapter-menu__contact > span { color: #c1c7d5; font-size: 1rem; }
.chapter-menu--shared .chapter-menu__contact a { width: fit-content; color: #f9fcf4; font-size: 1.2rem; overflow-wrap: anywhere; text-underline-offset: .25em; cursor: copy; }
.chapter-menu--shared .chapter-menu__contact .email-copy-line { display: flex; flex-wrap: wrap; align-items: center; gap: .65rem; min-width: 0; }
.chapter-menu--shared .chapter-menu__contact .email-copy { display: inline-flex; align-items: center; gap: .4rem; min-height: 2rem; padding: .3rem .6rem; color: #ff9ab6; background: transparent; border: 1px solid currentColor; border-radius: 999px; font: inherit; font-size: .82rem; font-weight: 750; white-space: nowrap; cursor: pointer; }
.chapter-menu--shared .chapter-menu__contact .email-copy svg { width: 1rem; height: 1rem; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.chapter-menu--shared .chapter-menu__contact .email-copy:hover { color: #272727; background: #ff9ab6; }
.chapter-menu--shared .chapter-menu__contact [role="status"] { margin: 0; color: #ff9ab6; font-size: .82rem; }
.chapter-menu--shared :is(a, button):focus-visible { outline: 3px solid #ff9ab6; outline-offset: 4px; }
@media (max-width: 700px) {
  .chapter-menu--shared .chapter-menu__layout { display: flex; flex-direction: column-reverse; align-items: stretch; gap: 1rem; min-height: 0; padding-top: 2rem; }
  .chapter-menu--shared .chapter-menu__body { padding: 0; }
  .chapter-menu--shared .chapter-menu__body h2 { font-size: clamp(2.8rem, 9vw, 4rem); }
  .chapter-menu--shared nav a { grid-template-columns: 3.6rem 1fr; min-height: 4.7rem; }
  .chapter-menu--shared nav a strong { font-size: clamp(2rem, 7vw, 3rem); }
  .chapter-menu--shared .chapter-menu__contact { grid-template-columns: 1fr; }
  .chapter-menu--shared .chapter-menu__portrait { align-self: center; width: min(90%, 420px); height: 360px; }
}
@media (prefers-reduced-motion: reduce) {
  .chapter-menu--shared nav a { transition: none; }
}
