/* The published navigation keeps the editor's existing text fields and links. */
@media (max-width: 1120px) {
  html.js .bar__in > .site-language-menu { display: none; }
  .bar__end { margin-inline-start: auto !important; }
}

.sheet {
  --sheet-accent: #d0bbff;
  inset: 0;
  display: flex;
  align-items: stretch;
  gap: 20px;
  padding: max(12px, env(safe-area-inset-top)) max(20px, calc((100vw - 600px) / 2)) max(28px, env(safe-area-inset-bottom));
  background:
    radial-gradient(ellipse at 95% 4%, #7650b926, transparent 42%),
    radial-gradient(ellipse at 0% 85%, #29336024, transparent 50%),
    #090710;
  isolation: isolate;
  scrollbar-width: thin;
  scrollbar-color: #544266 transparent;
  overscroll-behavior: contain;
  opacity: 0;
  translate: 0 18px;
  transition: opacity 240ms ease, translate 360ms cubic-bezier(.2,.7,.2,1);
}
.sheet.is-open { opacity: 1; translate: 0 0; }
.sheet__top {
  position: sticky;
  inset-block-start: -12px;
  z-index: 2;
  flex: 0 0 auto;
  height: auto;
  min-height: 68px;
  padding: 10px 0 14px;
  border-block-end: 1px solid #d0bbff1c;
  background: #090710f5;
  backdrop-filter: blur(18px);
}
.sheet__top .brand { gap: 12px; }
.sheet__top .brand__mark { width: 38px; height: 38px; border-radius: 12px; }
.sheet__top .brand__name { font-size: 1.22rem; }
.sheet__top .brand__tag { display: block; max-width: 24ch; line-height: 1.5; color: #a49aaf; }
.sheet__close {
  flex: 0 0 44px;
  height: 44px;
  width: 44px;
  border: 1px solid #d0bbff26;
  border-radius: 15px;
  background: #ffffff06;
  color: #e9e0f5;
  box-shadow: none;
  transition: background 160ms ease, border-color 160ms ease;
}
.sheet__close:hover { background: #d0bbff16; border-color: #d0bbff66; }
.sheet__languages {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  min-width: 0;
  flex-shrink: 0;
  gap: 12px;
  padding: 12px 14px;
  border: 1px solid #d0bbff16;
  border-radius: 18px;
  background: #ffffff03;
}
.sheet__language-label {
  flex: 0 0 auto;
  font-size: .75rem;
  font-weight: 500;
  color: #b6acbf;
}
.sheet__languages nav,
:is(.masthead-top .language-switch, .article-meta .article-languages) {
  display: flex;
  flex-wrap: nowrap;
  gap: 5px;
  min-width: 0;
  max-width: 100%;
  overflow-x: auto;
  padding-block-end: 8px;
  scrollbar-width: thin;
  scrollbar-color: #9d7bc6 #ffffff0a;
  overscroll-behavior-x: contain;
  scroll-snap-type: x proximity;
}
.sheet__languages nav::-webkit-scrollbar,
:is(.masthead-top .language-switch, .article-meta .article-languages)::-webkit-scrollbar { height: 6px; }
.sheet__languages nav::-webkit-scrollbar-track,
:is(.masthead-top .language-switch, .article-meta .article-languages)::-webkit-scrollbar-track { background: #ffffff0a; border-radius: 6px; }
.sheet__languages nav::-webkit-scrollbar-thumb,
:is(.masthead-top .language-switch, .article-meta .article-languages)::-webkit-scrollbar-thumb { background: #9d7bc6; border-radius: 6px; }
.sheet__languages nav a,
:is(.masthead-top .language-switch, .article-meta .article-languages) a {
  flex: 0 0 auto;
  white-space: nowrap;
  scroll-snap-align: start;
}
.sheet__languages nav a:focus-visible,
:is(.masthead-top .language-switch, .article-meta .article-languages) a:focus-visible { outline: 2px solid #d0bbff; outline-offset: -2px; }
@media (max-width: 800px) {
  .masthead-top { flex-wrap: wrap; }
  :is(.masthead-top .language-switch, .article-meta .article-languages) { flex-basis: 100%; }
  :is(.masthead-top .language-switch, .article-meta .article-languages) a { display: inline-flex; align-items: center; min-height: 44px; padding-inline: 14px; }
}
.sheet__languages a {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-height: 40px;
  padding: 7px 15px;
  border: 1px solid transparent;
  border-radius: 11px;
  color: #a89eb5;
  font-size: .8125rem;
  font-weight: 600;
  line-height: 1.5;
}
.sheet__languages a:hover { color: #f4eeff; background: #ffffff08; }
.sheet__languages a[aria-current] {
  background: #b28af51a;
  border-color: #c5a3ff38;
  color: #e1ceff;
}
.sheet__nav { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.sheet__nav a {
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 30px auto 1fr;
  align-items: start;
  justify-content: start;
  gap: 8px;
  min-width: 0;
  min-height: 139px;
  padding: 16px;
  border: 1px solid #e1ceff15;
  border-radius: 20px;
  background: linear-gradient(145deg, #ffffff06, #ffffff02);
  transition: border-color 160ms ease, background 160ms ease, transform 160ms ease;
}
.sheet__icon { grid-row: 1; color: #b6a4ce; }
.sheet__icon svg { width: 24px; height: 24px; }
.sheet__nav b {
  grid-row: 2;
  font: 600 1.1rem / 1.35 var(--f-body);
  letter-spacing: -.02em;
  color: #f1eaf9;
  overflow-wrap: anywhere;
}
.sheet__nav small {
  grid-row: 3;
  font: 400 .72rem / 1.6 var(--f-body);
  color: #a59aae;
  text-align: start;
  text-transform: none;
  letter-spacing: normal;
  overflow-wrap: anywhere;
}
.sheet__nav a::after {
  content: "↗";
  position: absolute;
  inset-inline-end: 16px;
  top: 15px;
  color: #83728f;
  font-size: 1.1rem;
}
[dir="rtl"] .sheet__nav a::after { content: "↖"; }
.sheet__nav a:hover { border-color: #d0bbff50; background: #d0bbff0b; }
.sheet__nav a:active { transform: scale(.98); }
.sheet__nav a[aria-current="page"] { border-color: #bc93ff66; background: linear-gradient(145deg, #9c69ee26, #7749ba0b); }
.sheet__nav a[aria-current="page"] b { background: none; color: #e7d8ff; }
.sheet__nav a[aria-current="page"] .sheet__icon { color: #d4b5ff; }
.sheet__nav a:last-child:nth-child(odd) { grid-column: 1 / -1; grid-template-columns: 30px 1fr; grid-template-rows: auto auto; min-height: 82px; column-gap: 14px; }
.sheet__nav a:last-child:nth-child(odd) .sheet__icon { grid-column: 1; grid-row: 1 / 3; align-self: center; }
.sheet__nav a:last-child:nth-child(odd) b { grid-column: 2; grid-row: 1; padding-inline-end: 20px; }
.sheet__nav a:last-child:nth-child(odd) small { grid-column: 2; grid-row: 2; }
.sheet__more { gap: 8px; padding-block: 4px; }
.sheet__more a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 9px 13px;
  border-radius: 12px;
  font-size: .77rem;
  line-height: 1.5;
  color: #bdb1cb;
  box-shadow: inset 0 0 0 1px #d0bbff1a;
}
.sheet__more a:hover, .sheet__more a[aria-current="page"] { background: #d0bbff12; color: #eee2fc; }
.sheet > .btn { flex: 0 0 auto; justify-content: center; min-height: 54px; border-radius: 17px; text-align: center; line-height: 1.6; }
.sheet__meta { margin: 0; padding-block: 0 8px; text-align: center; font-size: .625rem; letter-spacing: .05em; color: #96879f; }
html[dir="rtl"] .sheet :is(b, small, .brand__tag) { line-height: 1.7; letter-spacing: normal; }
@media (max-width: 360px) {
  .sheet { padding-inline: 14px; gap: 16px; }
  .sheet__nav { gap: 8px; }
  .sheet__nav a { padding: 13px; }
}
@media (prefers-reduced-motion: no-preference) {
  .sheet.is-open .sheet__nav a { animation: sheet-card-enter 320ms ease both; animation-delay: calc(var(--i, 0) * 25ms); }
  @keyframes sheet-card-enter { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
}
@media (prefers-reduced-motion: reduce) {
  .sheet, .sheet *, .sheet *::before, .sheet *::after { animation: none !important; transition: none !important; }
}

.article-meta .article-languages {
  flex: 1 1 100%;
  width: 100%;
  align-items: center;
  margin-inline-start: 0;
}
.article-meta .article-languages .translation-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  margin-inline-start: 0;
  padding: 7px 14px;
  border: 1px solid transparent;
  border-radius: 11px;
  text-decoration: none;
}
.article-meta .article-languages .translation-link:hover { background: #ffffff08; }
.article-meta .article-languages .translation-link[aria-current] {
  background: #b28af51a;
  border-color: #c5a3ff38;
  color: #e1ceff;
}
