html:not([dir=rtl]) body{direction:ltr;text-align:left}html:not([dir=rtl]) .grid{direction:ltr}html:not([dir=rtl]) .grid .world-tile{direction:ltr}html:not([dir=rtl]) .grid .world-tile b{direction:ltr;unicode-bidi:isolate}html[dir=rtl] body{text-align:right}html[dir=rtl] header{flex-direction:row-reverse}html[dir=rtl] .copy{margin-left:auto}html[dir=rtl] .grid{direction:rtl}html[dir=rtl] .grid .world-tile{direction:rtl}html[dir=rtl] .grid span{direction:rtl}html[dir=rtl] .grid .world-tile b{direction:ltr;unicode-bidi:isolate}
.grid .world-tile{position:relative;aspect-ratio:1;overflow:hidden;border-radius:4px;border:1px solid rgba(255,255,255,.58);box-shadow:0 18px 38px rgba(0,0,0,.38);background:#071f2d;isolation:isolate}
.grid .world-tile img{position:absolute;z-index:0;inset:-10%;width:120%;height:120%;object-fit:cover;transform:translate3d(calc(var(--mx,0px) + var(--phase,0px)),calc(var(--my,0px) + var(--scroll,0px)),0) scale(1.08);transition:transform .8s cubic-bezier(.2,.7,.2,1),filter .5s;filter:saturate(.82) contrast(1.08)}
.grid .world-tile::after{z-index:1;background:linear-gradient(180deg,rgba(3,17,26,.03) 20%,rgba(3,17,26,.94) 100%)}
.grid .world-tile span{z-index:2;pointer-events:none;text-shadow:0 2px 14px #000}
.grid .world-tile:hover img{transform:translate3d(calc(var(--mx,0px) + var(--phase,0px)),calc(var(--my,0px) + var(--scroll,0px)),0) scale(1.16);filter:saturate(1.05) contrast(1.1)}
.grid .world-tile:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
@media(prefers-reduced-motion:reduce){.grid .world-tile img{transform:scale(1.08)!important;transition:none!important}}