@import url('https://fonts.googleapis.com/css2?family=VT323&display=swap');
:root{color-scheme:dark;font-family:'VT323','Courier New',monospace;color:#d3d3d3;background:#000;font-synthesis:none}*{box-sizing:border-box}body{margin:0}main{width:min(850px,calc(100% - 40px));margin:24px auto 32px;font-size:22px;line-height:1.3}.connection{color:#939393;margin:0 0 12px}h1{font:inherit;margin:0;font-weight:400;color:#eee}.scene{position:relative;width:min(560px,100%);aspect-ratio:1;margin:0 auto 10px;overflow:hidden}.building{width:100%;height:100%;object-fit:contain;image-rendering:pixelated}.scene-caption{position:absolute;bottom:2%;left:0;width:100%;text-align:center;color:#777;font-size:18px}.notice{padding-left:28px;margin:5px 0 24px}.notice li{padding-left:2px;margin-bottom:10px}.status{color:#969696;margin:22px 0 8px}button{font:inherit;color:#d4d4d4;background:none;border:0;padding:4px 0;cursor:pointer}button:hover{color:#fff;text-shadow:0 0 7px #aaa}button:focus-visible,input:focus-visible{outline:1px dashed #fff;outline-offset:5px}nav{display:flex;gap:24px;flex-wrap:wrap;margin:0 0 22px}form label{display:block}.prompt{display:flex;align-items:center;gap:12px;margin-top:7px}.prompt input{font:inherit;min-width:0;flex:1;max-width:340px;background:#000;border:0;border-bottom:1px solid #3a3a3a;border-radius:0;color:white;padding:4px 0;caret-color:white}.muted{font-size:18px;color:#777;margin-top:8px}.menu{border-top:1px dashed #555;border-bottom:1px dashed #555;max-width:420px;padding:12px 0;margin-bottom:24px}.menu h2{font:inherit;color:#fff;margin:0 0 10px}.menu p{margin:3px 0}.menu p:not(.muted){display:flex;justify-content:space-between}footer{margin-top:36px;font-size:17px;color:#555}footer span{padding:0 8px}.person{position:absolute;width:64px;height:52px;pointer-events:none;animation:walk 12s linear infinite alternate;mix-blend-mode:screen}.sprite{width:100%;height:100%;background-image:url('sprites.png');background-size:200% 300%;image-rendering:pixelated;mix-blend-mode:screen;animation:step .5s steps(1) infinite}.chef{background-position:0 0}.waiter{background-position:0 50%}.diner{background-position:0 100%}.p1{left:39%;top:68%;animation-duration:8s;--dx:32px;--dy:15px}.p2{left:60%;top:69%;--dx:44px;--dy:-22px;animation-delay:-6s}.p3{left:25%;top:68%;--dx:48px;--dy:24px;animation-delay:-3s}.p4{left:45%;top:75%;--dx:65px;--dy:-32px;animation-delay:-9s}.p5{left:65%;top:65%;--dx:-35px;--dy:17px;animation-delay:-4s}.p6{left:32%;top:70%;--dx:-32px;--dy:-16px;animation-delay:-2s}.smoke{position:absolute;left:64%;top:10%;width:5px;height:5px;background:#888;animation:steam 3s steps(8) infinite}.s2{animation-delay:-1s}.s3{animation-delay:-2s}@keyframes walk{0%,8%{transform:translate(0,0)}45%,55%{transform:translate(var(--dx),var(--dy))}92%,100%{transform:translate(0,0)}}@keyframes step{0%,100%{background-position-x:0}50%{background-position-x:100%}}@keyframes steam{0%{opacity:0;transform:translate(0,0)}20%{opacity:.6}100%{opacity:0;transform:translate(12px,-38px)}}.paused *{animation-play-state:paused!important}[hidden]{display:none!important}@media(max-width:600px){main{font-size:20px;margin-top:18px}.scene{margin-top:12px}.person{width:46px;height:38px}.notice{padding-left:24px}nav{gap:10px 18px}.connection{font-size:18px}footer{font-size:16px}}@media(prefers-reduced-motion:reduce){.scene *{animation-play-state:paused}}

