:root{--yellow: #ffd400;--red: #e3261f;--ink: #141414;--cream: #fff8e1;--outline: 4px solid var(--ink);--shadow: 6px 6px 0 var(--ink);--font-head: "Luckiest Guy", Impact, system-ui, sans-serif;--font-body: "Nunito", system-ui, -apple-system, "Segoe UI", sans-serif}*,*:before,*:after{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--yellow);color:var(--ink);font-family:var(--font-body);font-size:18px;line-height:1.6;overflow-x:hidden}h1,h2,h3{font-family:var(--font-head);font-weight:400;letter-spacing:.02em;line-height:1.05;margin:0 0 .4em}.sticker{background:#fff;border:var(--outline);border-radius:18px;box-shadow:var(--shadow)}.nav{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px clamp(16px,4vw,48px)}.nav__logo{font-family:var(--font-head);font-size:28px;padding:6px 16px 2px;color:var(--red);text-decoration:none;transform:rotate(-3deg)}.nav__links{display:flex;gap:clamp(10px,2.5vw,28px)}.nav__links a{font-family:var(--font-head);font-size:clamp(16px,2.2vw,22px);color:var(--ink);text-decoration:none;padding:4px 2px 0;border-bottom:4px solid transparent;transition:border-color .15s,color .15s}.nav__links a:hover,.nav__links a:focus-visible{color:var(--red);border-color:var(--red)}.hero{text-align:center;padding:8px 16px 0}.hero__title{font-size:clamp(40px,8vw,96px);color:var(--red);-webkit-text-stroke:3px var(--ink);paint-order:stroke fill;text-shadow:5px 5px 0 var(--ink);margin-bottom:.1em}.hero__tagline{font-weight:900;font-size:clamp(16px,2.2vw,22px);margin:0 auto;max-width:48ch}.stage{position:relative;width:100%;max-width:1400px;height:clamp(420px,74vh,900px);margin:0 auto;touch-action:manipulation}.stage canvas{display:block;width:100%;height:100%;outline:none;-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 5%,#000 86%,transparent 100%);mask-image:linear-gradient(to bottom,transparent 0,#000 5%,#000 86%,transparent 100%)}.stage__status{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:12px;pointer-events:none;font-weight:900}.stage__status[hidden]{display:none}.stage__status p{margin:0;background:#fff;border:var(--outline);border-radius:999px;box-shadow:var(--shadow);padding:8px 20px}.stage__status.is-error p{border-radius:18px;max-width:32ch;text-align:center}.stage__status.is-error .spinner{display:none}.spinner{width:54px;height:54px;border-radius:50%;border:8px solid var(--ink);border-top-color:var(--red);animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.hint{position:absolute;left:0;top:0;display:flex;align-items:center;gap:6px;transform:translate(calc(-100% - 70px),-50%);pointer-events:none;font-family:var(--font-head);font-size:clamp(18px,2.4vw,26px);white-space:nowrap}.hint[hidden]{display:none}.hint__label{order:-1;background:var(--red);color:#fff;border:var(--outline);border-radius:12px;box-shadow:4px 4px 0 var(--ink);padding:4px 12px 0;transform:rotate(-4deg)}.hint__arrow{display:inline-block;font-size:1.6em;transform:rotate(-90deg);animation:nudge .7s ease-in-out infinite alternate;-webkit-text-stroke:1px var(--ink)}@keyframes nudge{0%{transform:rotate(-90deg) translateY(0)}to{transform:rotate(-90deg) translateY(-12px)}}.bubble{position:absolute;left:0;top:0;max-width:min(320px,70vw);padding:12px 18px 10px;background:#fff;border:var(--outline);border-radius:22px;box-shadow:5px 5px 0 var(--ink);font-family:var(--font-head);font-size:clamp(16px,2vw,22px);line-height:1.2;text-align:center;pointer-events:none;opacity:0;visibility:hidden;transform:translate(-50%,calc(-100% - 22px)) scale(0);transform-origin:50% calc(100% + 22px)}.bubble:before,.bubble:after{content:"";position:absolute;left:50%;border-style:solid;transform:translate(-50%)}.bubble:before{top:100%;border-width:24px 14px 0;border-color:var(--ink) transparent transparent}.bubble:after{top:calc(100% - 1px);border-width:17px 9px 0;border-color:#fff transparent transparent}.bubble.is-visible{visibility:visible;animation:pop .35s cubic-bezier(.2,1.6,.4,1) forwards}.bubble.is-leaving{animation:fade .4s ease-in forwards}@keyframes pop{0%{opacity:0;transform:translate(-50%,calc(-100% - 22px)) scale(.2)}to{opacity:1;transform:translate(-50%,calc(-100% - 22px)) scale(1)}}@keyframes fade{0%{opacity:1;transform:translate(-50%,calc(-100% - 22px)) scale(1)}to{opacity:0;transform:translate(-50%,calc(-100% - 30px)) scale(.9)}}.section{max-width:1100px;margin:0 auto;padding:clamp(40px,7vw,80px) 16px 0}.section__title{text-align:center;font-size:clamp(32px,5vw,56px);color:var(--red);-webkit-text-stroke:2px var(--ink);paint-order:stroke fill;text-shadow:4px 4px 0 var(--ink)}.card{padding:clamp(20px,3vw,32px)}.card--wide h2{font-size:clamp(32px,5vw,52px);color:var(--red)}.card--wide{border-top:14px solid var(--red)}.links{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:28px}.link-btn{display:flex;align-items:center;justify-content:center;gap:14px;padding:22px 24px 18px;color:var(--ink);text-decoration:none;font-family:var(--font-head);font-size:clamp(24px,3vw,32px);transition:transform .12s,box-shadow .12s,background .12s}.link-btn:nth-child(odd){transform:rotate(-1.5deg)}.link-btn:hover,.link-btn:focus-visible{background:var(--red);color:#fff;transform:translate(-3px,-3px) rotate(0);box-shadow:9px 9px 0 var(--ink)}.link-btn:active{transform:translate(3px,3px);box-shadow:2px 2px 0 var(--ink)}.link-btn__icon{display:grid;place-items:center;width:52px;height:52px;flex:none;font-family:var(--font-body);font-weight:900;font-size:26px;color:var(--ink);background:var(--yellow);border:var(--outline);border-radius:50%}.link-btn__label{padding-top:4px}.footer{margin-top:clamp(56px,9vw,100px);background:var(--red);color:#fff;border-top:var(--outline);text-align:center;padding:36px 16px;font-weight:700}.footer p{margin:0}.footer__logo{font-family:var(--font-head);font-size:34px;-webkit-text-stroke:2px var(--ink);paint-order:stroke fill;text-shadow:3px 3px 0 var(--ink)}@media(max-width:600px){.nav__logo{font-size:22px}.stage{height:clamp(380px,64vh,560px)}.hint{transform:translate(calc(-100% - 40px),-50%)}}@media(prefers-reduced-motion:reduce){.hint__arrow,.spinner{animation:none}}
