*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#090a09;color:#f8f8f6}body{font-family:Arial,Helvetica,sans-serif}main{min-height:100svh}.entrance{min-height:100svh;width:100%;padding:clamp(24px,5vh,70px) 24px;display:flex;flex-direction:column;justify-content:center;align-items:center;color:inherit;text-decoration:none;text-align:center;-webkit-tap-highlight-color:transparent}.entrance:focus-visible{outline:2px solid #f8f8f6;outline-offset:-12px}.entrance-mask{display:block;flex:none;height:55svh;max-height:640px;max-width:78vw;width:auto;aspect-ratio:710/1156;overflow:hidden;opacity:0;animation:mask-arrives 2.8s ease-out .15s forwards}h1{font-size:clamp(2.5rem,7vw,7rem);font-weight:800;line-height:1.15;letter-spacing:-.04em;margin:clamp(24px,5vh,55px) 0 0;opacity:0;animation:name-arrives 1.8s ease-out 2.65s forwards}@keyframes mask-arrives{from{opacity:0}to{opacity:1}}@keyframes name-arrives{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes label-arrives{from{opacity:0}to{opacity:.75}}@media(max-height:500px) and (orientation:landscape){.entrance{padding:20px}.entrance-mask{height:43svh}h1{font-size:2.5rem;margin-top:16px}}
.entrance-name{display:inline-block;color:inherit;text-decoration:none;cursor:pointer;padding:8px 12px;transition:color .2s}.entrance-name:hover{color:#c6cec8}.entrance-name:focus-visible{outline:2px solid currentColor;outline-offset:8px}h1:focus-within{animation:none;opacity:1;transform:none}

.entrance-name{width:min(78vw,650px);padding:8px}.painted-name{display:block;width:100%;height:auto}h1{line-height:0}.entrance-name:hover{opacity:.85}@media(max-height:500px) and (orientation:landscape){.entrance-name{width:min(48vw,350px)}}
