/* Motion recreates the supplied recording; the layout lives in styles.css. */
:root { --motion-ease: cubic-bezier(.22, .68, .16, 1); }
html { scrollbar-gutter: stable; }
html.is-loading { overflow: hidden; }
.page-loader { position: fixed; inset: 0; z-index: 9999; pointer-events: none; }
.page-loader[hidden] { display: none; }
.is-loading .page-loader[hidden] { display: block; }
.loader-curtain { position: absolute; inset: 0; width: 100%; height: 100%; fill: #1b1b1b; }
.loader-word { position: absolute; inset: 0; display: flex; justify-content: center; align-items: center; gap: 17px; color: #fff; font-size: 13px; font-weight: 400; }
.loader-logo { position: absolute; bottom: calc(50% + 35px); left: 50%; transform: translateX(-50%); width: 45px; height: 64px; object-fit: contain; }
.loader-word span { animation: loading-letter 1.1s ease-in-out infinite; }
.loader-word span:nth-of-type(2) { animation-delay: .1s; }
.loader-word span:nth-of-type(3) { animation-delay: .2s; }
.loader-word span:nth-of-type(4) { animation-delay: .3s; }
.loader-word span:nth-of-type(5) { animation-delay: .4s; }
.loader-word span:nth-of-type(6) { animation-delay: .5s; }
.loader-word span:nth-of-type(7) { animation-delay: .6s; }
@keyframes loading-letter { 0%, 100% { opacity: .12; } 50% { opacity: 1; } }
.is-loading .site-shell, .is-loading .contact-site { opacity: 0; }
.title-line { display: block; overflow: clip; padding-bottom: .12em; margin-bottom: -.12em; perspective: 500px; }
.title-line-inner { display: inline-block; transform-origin: 50% 100%; }
.hero-main h1 { transform: translate3d(0, var(--title-drift, 0px), 0); }
.hero-art { transform: translate3d(var(--chess-x, 0px), var(--chess-y, 0px), 0) scale(1.035); }
.about-main { background-position: center calc(50% + var(--about-drift, 0px)); }
.motion-pending { opacity: 0; }
.project-image { clip-path: inset(0 round 10px); }
.discipline-content { position: absolute; inset: 0; padding: inherit; }
.discipline-content[aria-hidden="true"] { pointer-events: none; }
.discipline-card p { bottom: 68px; }
.carousel-pause { margin-right: 3px; }
.carousel-pause span { display: block; width: 8px; height: 9px; border-left: 2px solid currentColor; border-right: 2px solid currentColor; }
.carousel-pause[aria-pressed="true"] span { width: 0; height: 0; border: 0; border-left: 7px solid currentColor; border-top: 5px solid transparent; border-bottom: 5px solid transparent; margin-left: 2px; }
.service-scene.is-physics .floating-tag,
.service-scene.is-physics .code-symbol { inset: 0 auto auto 0; margin: 0; translate: none; transform: translate3d(var(--tag-x), var(--tag-y), 0) rotate(var(--tag-angle)); user-select: none; touch-action: pan-y; }
.service-scene.is-physics .floating-tag { transition: box-shadow .25s; }
.service-scene.is-physics .floating-tag:hover { translate: none; }
.service-scene.is-physics .is-dragging { z-index: 8; box-shadow: 0 8px 18px #0002; cursor: grabbing; }
.service-scene.is-physics .floating-tag:focus-visible { z-index: 9; outline-offset: -4px; }
.cursor-ring { position: fixed; top: 0; left: 0; width: 36px; height: 36px; border: 1px solid #fffc; border-radius: 50%; pointer-events: none; z-index: 100; opacity: 0; mix-blend-mode: difference; transition: width .25s, height .25s, opacity .2s; }
.cursor-ring.is-visible { opacity: .8; }
.cursor-ring.is-hovering { width: 62px; height: 62px; }
.button, .sidebar-shortcuts > a, .menu-toggle { transform: translate3d(var(--magnet-x, 0px), var(--magnet-y, 0px), 0); }
.roll-label { display: inline-block; white-space: pre; line-height: 1.35; }
.roll-visual { display: flex; overflow: hidden; }
.roll-letter { position: relative; display: inline-block; transition: transform .55s var(--motion-ease); transition-delay: calc(var(--letter) * 12ms); }
.roll-letter::after { content: attr(data-letter); position: absolute; left: 0; top: 100%; }
a:hover > .roll-label .roll-letter,
button:hover > .roll-label .roll-letter { transform: translateY(-100%); }
.navigation { background: linear-gradient(90deg, #111 0%, #111 64%, #1b1b1b 64%, #1b1b1b 100%); }
.navigation::backdrop { background: #0007; backdrop-filter: none; }
.navigation nav > a { transition: color .3s, opacity .3s; }
.navigation nav:has(> a:hover) > a:not(:hover) { opacity: .3; }
.navigation nav > a:hover { color: #fff; }
.navigation-info { border-left-color: transparent; }
.content-dialog::backdrop { backdrop-filter: blur(8px); }
.back-to-top circle { stroke-dasharray: 131.95; stroke-dashoffset: var(--scroll-remaining, 131.95); transform-origin: 24px 24px; transform: rotate(-90deg); transition: stroke-dashoffset .12s linear; }
@media (max-width: 767px) {
  .loader-word { gap: 12px; font-size: 11px; }
  .navigation { background: #151515; }
  .navigation-info { border-top-color: #ffffff2b; }
}
@media (hover: none), (pointer: coarse) { .cursor-ring { display: none; } }
@media (prefers-reduced-motion: reduce) {
  html.is-loading { overflow: auto; }
  .page-loader, .cursor-ring { display: none !important; }
  .is-loading .site-shell, .is-loading .contact-site, .motion-pending { opacity: 1; }
  .hero-main h1, .hero-art, .button { transform: none; }
  .about-main { background-position: center; }
  .roll-letter { transform: none !important; }
}
