/* Hand-written additions on top of the build CSS. */
/* Guest hero: clickable as a whole (see guest-bar.js), a little darker under the text on desktop. */
.guest-hero{cursor:pointer;background-image:linear-gradient(90deg,#0a0e1ff7 0%,#0a0e1fe6 40%,#0a0e1f8c 56%,#0a0e1f00 72%),var(--bg-d)}
@media (max-width:900px){
  /* Phones: the picture (dark sky top-left, castle and coins bottom-right) sits behind the lower part of the text,
     darkened under the text so the fine print stays readable; coins and dice show below it.
     The picture has its own file name, so browsers do not show the old cached square. */
  .guest-hero{--hw:min(100vw - 32px,640px);padding-bottom:calc(var(--hw) * .42);
    background-image:linear-gradient(180deg,#0a0e1f 0%,#0a0e1ff2 calc(100% - var(--hw) * .55),#0a0e1f00 calc(100% - var(--hw) * .3)),url(/img/banners/guest-mobile-v2.webp);
    background-size:100% 100%,100% auto;background-position:0 0,right bottom}
}