/* Shared sitewide directional arrows. Only phone widths and light theme. */
@media screen and (max-width:699px) {
:root[data-theme=light] :is(body,#desktop-canvas) {
  /* One painted arrow shape across phone-light links, buttons and navigation. */
  --phone-link-arrow:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18.523438 18.768555'%3E%3Cpath d='M3.7675345 9.3842775H14.7559035M9.261719 3.890093L14.7559035 9.3842775L9.261719 14.878462' fill='none' stroke='black' stroke-width='2.511627' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  & .button-arrow,
  & .text-link .arrow-tail::after,
  & :is(.site-nav.open,.footer-grid nav) > a .arrow-tail::before,
  & .project-card h3 a span[aria-hidden=true] {
    display:inline-block;
    flex:0 0 18.523438px;
    width:18.523438px;
    height:18.768555px;
    background:currentColor;
    -webkit-mask:var(--phone-link-arrow) center/contain no-repeat;
    mask:var(--phone-link-arrow) center/contain no-repeat;
    transform:none;
  }
  & .button-arrow {
    content:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24'/%3E");
  }
  & .project-card h3 a span[aria-hidden=true] {
    font-size:0;
    vertical-align:middle;
    transform:rotate(-45deg);
  }
}
@media (prefers-color-scheme:light) {
:root:not([data-theme]) :is(body,#desktop-canvas) {
  /* One painted arrow shape across phone-light links, buttons and navigation. */
  --phone-link-arrow:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18.523438 18.768555'%3E%3Cpath d='M3.7675345 9.3842775H14.7559035M9.261719 3.890093L14.7559035 9.3842775L9.261719 14.878462' fill='none' stroke='black' stroke-width='2.511627' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  & .button-arrow,
  & .text-link .arrow-tail::after,
  & :is(.site-nav.open,.footer-grid nav) > a .arrow-tail::before,
  & .project-card h3 a span[aria-hidden=true] {
    display:inline-block;
    flex:0 0 18.523438px;
    width:18.523438px;
    height:18.768555px;
    background:currentColor;
    -webkit-mask:var(--phone-link-arrow) center/contain no-repeat;
    mask:var(--phone-link-arrow) center/contain no-repeat;
    transform:none;
  }
  & .button-arrow {
    content:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24'/%3E");
  }
  & .project-card h3 a span[aria-hidden=true] {
    font-size:0;
    vertical-align:middle;
    transform:rotate(-45deg);
  }
}
}
}
