body{color-scheme:light dark;margin:0;font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;background-color:light-dark(#f8f9fa,#1a1a1a);color:light-dark(#213547,#ffffff);line-height:1.6;scrollbar-gutter:stable}main{max-width:800px;margin:0 auto;padding:2rem}nav{margin-bottom:2rem;display:flex;justify-content:space-between}nav a{color:light-dark(#646cff,#a5a9ff);text-decoration:none}.arrow{text-shadow:0 0 8px red}h1{font-size:2.5rem;margin-bottom:2rem;text-wrap:balance}h2{display:inline-block}.card{background:light-dark(#ffffff,#242424);padding:2rem;border-radius:8px;box-shadow:0 2px 8px #0000001a}.card img.small{width:200px;height:auto;float:right}.next-button{display:inline-block;margin-top:1rem;padding:.8rem 1.5rem;background-color:light-dark(#646cff,#a5a9ff);color:light-dark(#ffffff,#1a1a1a);text-decoration:none;border-radius:4px;transition:background-color .2s}.next-button:hover{background-color:light-dark(#535bf2,#8f94ff)}#whiteboard{max-width:500px}#fish{display:block;float:left}#fish.right{margin-left:auto;transform:rotateY(180deg);float:right}@media (prefers-reduced-motion: no-preference){@view-transition{navigation: auto;}}::view-transition-group(root){animation-duration:1s}::view-transition-old(root){animation-duration:.6s}::view-transition-new(root){animation:.6s .4s both slide-up linear(0,1.2 50%,.8 75%,1)}@keyframes slide-up{0%{opacity:0;transform:translateY(10vh)}}