*{box-sizing:border-box}
html,body{margin:0;width:100%;min-height:100%;background:#0955e8}
.entrance{position:relative;width:100%;min-height:100vh;min-height:100svh;display:grid;place-items:center;overflow:hidden}
.entrance-scene{position:relative;width:100%;max-width:177.78svh;aspect-ratio:1672/941}
.entrance-scene>img{display:block;width:100%;height:auto}
.entrance-sign{position:absolute;left:50%;top:55%;width:10.5%;padding:clamp(4px,.7vw,12px) 3px;transform:translateX(-50%) rotate(-3deg);display:flex;align-items:center;justify-content:center;background:#ec2987;color:#fff;text-decoration:none;border:2px solid #ffda39;box-shadow:3px 5px 0 #042f7d66;font:bold clamp(8px,1.7vw,28px)/1.1 Georgia,serif;letter-spacing:.08em;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease;-webkit-tap-highlight-color:transparent}
.entrance-sign::before{content:"";position:absolute;bottom:100%;left:25%;width:50%;height:75%;background:#fff;clip-path:polygon(50% 0,100% 100%,97% 100%,50% 7%,3% 100%,0 100%);pointer-events:none}
.entrance-sign::after{content:"";position:absolute;top:50%;left:50%;width:100%;height:100%;min-width:44px;min-height:44px;transform:translate(-50%,-50%)}
.entrance-sign:hover{transform:translateX(-50%) rotate(0deg);box-shadow:4px 7px 0 #042f7d88}
.entrance-sign:focus-visible{outline:4px solid white;outline-offset:5px}
@media(max-width:600px) and (orientation:portrait){.entrance-scene{width:100%;}.entrance-sign{border-width:1px}}
@media(prefers-reduced-motion:reduce){.entrance-sign{transition:none}}