*{margin:0;padding:0}#view{width:100%;height:100%;position:absolute;z-index:1;top:0;overflow:hidden;cursor:pointer;background-color:#00008b}#view canvas{width:100%;height:100%}#media{position:absolute;left:10px;bottom:10px;z-index:2}#control{position:absolute;right:10px;top:10px;padding-right:10px;z-index:2}#control.disabled{opacity:.3}#control a{opacity:1}#control a.disabled{opacity:.3}.overlay{width:100vw;height:100vh;background:#000c;display:flex;z-index:10;animation:fadeInOverlay .5s ease-out forwards}@media (min-aspect-ratio: 1/1){.overlay{flex-direction:row}.pane{width:50%;height:100%;gap:1vw}}@media (max-aspect-ratio: 1/1){.overlay{flex-direction:column}.pane{width:100%;height:50%}}.pane{display:flex;justify-content:center;align-items:center;background:#00000080;flex-direction:column}.fade-out{animation:fadeOutOverlay .5s ease-out .5s forwards}@keyframes fadeInOverlay{0%{opacity:0;transform:scale(1.05)}to{opacity:1;transform:scale(1)}}@keyframes fadeOutOverlay{0%{opacity:1}to{opacity:0}}.pane-1{background-image:url(../img/caption.png);background-size:contain;background-position:center;background-repeat:no-repeat}.pane-2{overflow:auto}.choice{width:60%;background-image:url(../img/board.png);background-size:contain;background-position:center;background-repeat:no-repeat;padding:.5rem 1rem;font-family:Yomogi,cursive;font-size:2vw;color:#000;cursor:pointer;text-align:center;transform:translate(0);opacity:1;pointer-events:auto;transition:transform .4s ease-out,opacity .4s ease-out}.choice.ape{pointer-events:none;opacity:0;transform:translate(-100%)}.choice:hover{opacity:.5}@keyframes bounce{0%{transform:translateY(0)}30%{transform:translateY(-20px)}50%{transform:translateY(0)}70%{transform:translateY(-10px)}to{transform:translateY(0)}}.bounce{animation:bounce .6s}
