@font-face{font-family:Arcade;src:url(assets/arcade.ttf) format('truetype');font-display:swap}*{box-sizing:border-box}html{min-height:100%;background:#111320}body{margin:0;min-height:100svh;color:#ffe5a0;font-family:Arcade,monospace;background:radial-gradient(ellipse at 50% 48%,#32314b 0,transparent 62%),#111320}body:after{content:"";position:fixed;inset:0;pointer-events:none;background:repeating-linear-gradient(transparent 0 3px,#00000016 3px 4px);z-index:5}header{position:absolute;left:32px;top:28px;font-size:20px;line-height:1.8}header span{display:block;font-size:10px;color:#bdac92}main{min-height:100svh;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:95px 48px 65px}.machine{position:relative;width:min(100%,540px);filter:drop-shadow(0 22px 0 #00000036)}.marquee{display:flex;align-items:center;justify-content:space-evenly;background:#a74b38;border:8px solid #eab76a;outline:4px solid #171521;box-shadow:inset 0 0 0 4px #6c2931,0 -8px 0 #8d633f;margin:0 18px;padding:20px 12px;text-align:center}.marquee h1{font-size:clamp(19px,3.4vw,30px);line-height:1.6;margin:0;text-shadow:3px 3px #622f31}.star{font-size:28px;color:#ffdb78}.cabinet{background:#d49852;border:8px solid #efbf74;outline:4px solid #171521;padding:21px 22px 24px;box-shadow:inset 6px 0 #a6693e,inset -6px 0 #a6693e}.eyebrow{text-align:center;font-size:10px;color:#432e31;line-height:1.8;margin-bottom:18px}.reel-frame{display:flex;gap:8px;padding:10px;background:#332530;border:4px solid #784737;box-shadow:0 4px #ffd88d,inset 0 4px #191922}.reel{height:170px;flex:1;min-width:0;overflow:hidden;background:#111320;position:relative}.reel:after{content:"";position:absolute;inset:0;box-shadow:inset 0 14px 15px #0007,inset 0 -14px 15px #0007;pointer-events:none}.strip{will-change:transform}.symbol{height:170px;display:flex;align-items:center;justify-content:center}.icon{display:block;width:100%;height:100%;background-image:url(assets/symbols.png);background-size:200% 100%;background-position:0 50%;image-rendering:pixelated}.icon.microphone{background-position:100% 50%}.result{min-height:112px;margin:20px 0;background:#22222b;border:4px solid #976143;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:15px 4px;text-align:center;color:#f5d681}#prompt{font-size:15px;line-height:1.5}#artist{color:#7bf3cd;font-size:clamp(14px,2.6vw,22px);text-decoration:none;line-height:1.6}#artist[href]:hover{text-decoration:underline;text-underline-offset:6px}#artist.reveal{animation:flash .7s ease-in-out 3}#hint{font-size:8px;line-height:1.8;color:#bcaf98}button{font-family:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}#spin{display:block;width:100%;border:4px solid #542d33;background:#b9493b;color:#fff0b6;font-size:22px;padding:19px 14px;box-shadow:inset 0 4px #ec8660,0 7px #683536;transition:transform .12s}#spin:hover{background:#cb5843}#spin:active{transform:translateY(5px);box-shadow:inset 0 4px #ec8660,0 2px #683536}button:focus-visible,a:focus-visible{outline:4px solid #8effdf;outline-offset:5px}button:disabled{cursor:wait}#spin:disabled{color:#d8b4a2;background:#8f453a}.lever{position:absolute;right:-43px;top:165px;width:40px;height:150px;background:none;border:0;padding:0;transform-origin:bottom center}.stem{position:absolute;left:17px;top:22px;width:11px;height:110px;background:#dac7a1;box-shadow:inset -4px 0 #8f817a;z-index:1}.knob{position:absolute;top:0;left:3px;width:37px;height:37px;background:#bd4b42;border:4px solid #512d37;box-shadow:inset 4px 4px #ee8c68;z-index:2}.base{position:absolute;bottom:0;left:0;width:32px;height:30px;background:#a9784b;border:4px solid #472e32}.lever.pulled .stem{top:78px;height:54px}.lever.pulled .knob{top:65px}.foot{background:#604338;border:4px solid #211b25;border-top:0;margin:0 8px;display:flex;justify-content:space-between;align-items:center;padding:17px 20px;font-size:9px;color:#d8b081;box-shadow:inset 0 5px #48312f}.instruction{font-size:9px;line-height:2;text-align:center;color:#a99a9b;margin:26px 0 0}footer{position:absolute;right:24px;bottom:20px;font-size:8px;color:#8a8191} [hidden]{display:none!important}@keyframes flash{50%{color:#fff4b5;text-shadow:0 0 16px #fff49c}}@media(max-width:600px){header{position:static;padding:22px 22px 0;font-size:15px}header span{font-size:8px}main{min-height:calc(100svh - 80px);padding:40px 42px 65px 20px}.cabinet{padding:15px 12px 20px;border-width:6px}.marquee{margin:0 12px;padding:14px 5px;border-width:6px}.star{font-size:18px}.eyebrow{font-size:7px}.reel-frame{gap:5px;padding:6px}.reel,.symbol{height:135px}.lever{right:-31px;transform:scale(.78);transform-origin:left center;top:130px}#prompt{font-size:12px}#hint{font-size:7px}.result{min-height:105px}.instruction{font-size:7px}footer{position:static;text-align:right;padding:0 20px 16px}#spin{font-size:18px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
footer a{display:inline-block;color:#bdac92;font-size:10px;line-height:1.8;padding:12px;text-underline-offset:5px}footer a:hover{color:#ffe5a0}