@import url('https://fonts.googleapis.com/css2?family=Archivo+Black&family=Space+Mono:wght@400;700&display=swap');
:root{--pink:#ff43d4;--lime:#deff49;--ink:#142018}*{box-sizing:border-box}body{margin:0;background:#323e25;color:#fff8dd;font-family:'Space Mono',monospace;overflow-x:hidden}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer;font:inherit}button:focus-visible,a:focus-visible{outline:3px solid #fff;outline-offset:6px}.terrain{position:fixed;inset:0;z-index:-2;background:radial-gradient(ellipse at 10% 25%,#55623a 0 12%,transparent 12.3%),radial-gradient(ellipse at 85% 10%,#222e1d 0 18%,transparent 18.3%),radial-gradient(ellipse at 60% 60%,#58603a 0 20%,transparent 20.3%),radial-gradient(ellipse at 5% 95%,#1b291c 0 22%,transparent 22.3%),#35432c;background-size:700px 650px}.terrain:after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 3px,#00000012 4px);opacity:.7}header{height:84px;display:flex;align-items:center;justify-content:space-between;padding:0 5%;border-bottom:1px solid #faffbc35}.brand{display:flex;gap:15px;align-items:center;color:var(--lime);font:italic 900 32px Arial;text-decoration:none}.brand span{font:11px 'Space Mono',monospace;letter-spacing:2px;color:#fff8dd}.controls{display:flex;gap:10px}.controls button,footer button{background:transparent;border:1px solid #fbffd464;color:#fff8dd;border-radius:30px;padding:10px 15px;font-size:10px}.stage{height:620px;max-width:1400px;margin:auto;position:relative;isolation:isolate}.title{position:absolute;z-index:4;top:100px;width:100%;text-align:center;pointer-events:none}.title p{font-size:10px;letter-spacing:4px;color:var(--lime)}h1{font:italic 900 clamp(60px,10.4vw,150px)/1 'Archivo Black',Impact,sans-serif;letter-spacing:-8px;margin:22px 0 12px;transform:rotate(-5deg);background:linear-gradient(#fff 0%,#ffc6fa 21%,#ff64d7 45%,#7500ac 49%,#f37eff 53%,#fff6ff 80%,#a848e6);background-clip:text;color:transparent;-webkit-text-stroke:1px #ffc4fe;filter:drop-shadow(3px 6px 0 #65068a) drop-shadow(5px 9px 0 #0c140e)}.subtitle{display:inline-block;padding:7px 20px;background:var(--lime);color:#18231b;font-size:11px;transform:rotate(-3deg);box-shadow:4px 4px 0 #151c12}.sticker{position:absolute;border:0;background:none;padding:0;filter:drop-shadow(3px 7px 0 #111b1770);transition:filter .2s;z-index:3}.sticker img{width:100%;display:block;pointer-events:none}.sticker:hover{filter:drop-shadow(0 0 12px var(--pink))}.hero{width:320px;left:calc(50% - 160px);bottom:0;transform:rotate(8deg);animation:float 5s ease-in-out infinite}.shades{width:220px;left:5%;bottom:30px;transform:rotate(-12deg);animation:float 4s ease-in-out infinite reverse}.flex{width:300px;right:2%;bottom:20px;transform:rotate(9deg);animation:float 6s ease-in-out infinite}.sign{position:absolute;width:225px;top:5px;left:5%;transform:rotate(-14deg);z-index:5;clip-path:polygon(52% 0,66% 19%,84% 16%,86% 37%,94% 48%,87% 58%,88% 79%,63% 78%,46% 99%,31% 77%,15% 77%,17% 62%,7% 51%,17% 39%,18% 23%,38% 21%)}.badge{position:absolute;right:9%;top:38px;width:100px;height:100px;background:var(--pink);color:#24201a;display:flex;flex-direction:column;justify-content:center;align-items:center;font-size:10px;transform:rotate(15deg);clip-path:polygon(50% 0,60% 15%,78% 5%,80% 25%,100% 25%,90% 45%,100% 60%,80% 68%,80% 90%,60% 85%,50% 100%,40% 85%,20% 95%,20% 75%,0 75%,10% 55%,0 40%,20% 32%,20% 10%,40% 15%)}.badge b{font-size:19px}.skip{position:absolute;bottom:4px;left:calc(50% - 88px);z-index:6;width:176px;border:2px solid #111;background:#fff7df;padding:10px;box-shadow:4px 4px #101b13;font-size:11px;transform:rotate(-4deg)}.stars{position:absolute;top:100px;width:100%;display:flex;justify-content:space-around;color:var(--lime);font-size:42px;pointer-events:none}.stars span{color:#ff8bf0;position:relative;top:360px}.dashboards{max-width:1140px;margin:35px auto 65px;padding:0 30px;position:relative;z-index:6}.section-label{display:flex;justify-content:space-between;align-items:center;margin-bottom:28px}.section-label h2{font-size:12px;letter-spacing:3px}.section-label span{font-size:10px;color:#c7d4b7}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.card{position:relative;text-align:left;color:#172018;border:2px solid #101b12;border-radius:0;padding:24px;height:215px;box-shadow:8px 8px 0 #111b15;transition:transform .25s;background:var(--lime)}.card:nth-child(2){background:var(--pink);transform:rotate(2deg)}.card:nth-child(3){background:#b695fa;transform:rotate(-2deg)}.card:hover{transform:translateY(-12px) rotate(-3deg)}.card .num{font-size:11px;letter-spacing:2px}.card h3{font:26px 'Archivo Black',Impact,sans-serif;max-width:180px;margin:35px 0 10px}.card .status{font-size:10px;border:1px solid #172018;padding:4px 8px}.card .arrow{position:absolute;bottom:20px;right:22px;font-size:28px}.card img{position:absolute;right:6px;top:-25px;width:110px;height:130px;object-fit:contain;transform:rotate(10deg);filter:drop-shadow(3px 3px #19201845)}footer{border-top:1px solid #faffbc35;padding:25px 5%;display:flex;align-items:center;justify-content:space-between;font-size:10px;color:#c1cbae}dialog{background:#fff7dd;border:3px solid #152318;box-shadow:12px 12px var(--pink);color:#142018;padding:45px;max-width:calc(100vw - 50px)}dialog::backdrop{background:#121b14b5;backdrop-filter:blur(8px)}dialog h2{font:32px 'Archivo Black',Impact,sans-serif}dialog p{font-size:12px;line-height:1.8}dialog button{background:var(--lime);border:2px solid #142018;padding:10px 16px}#close{position:absolute;right:10px;top:10px;background:none;border:none;font-size:25px}.eyebrow{letter-spacing:4px}.confetti{position:fixed;top:-30px;pointer-events:none;z-index:20;animation:fall 2.5s ease-in forwards;font-size:26px}.intro .hero{animation:entrance 2.7s both}.intro .cards{animation:pop 1s 2s both}.intro .title{animation:pop 1s .6s both}.intro .shades,.intro .flex{animation:pop 1s 1.5s both}.wobble{animation:wiggle .65s!important}.paused *{animation-play-state:paused!important}@keyframes entrance{0%,35%{transform:translateY(-100px) scale(1.65);z-index:8}100%{transform:rotate(8deg) scale(1)}}@keyframes pop{0%{opacity:0;transform:translateY(80px) scale(.5)}65%{opacity:1;transform:translateY(-15px) scale(1.06)}100%{opacity:1;transform:translateY(0) scale(1)}}@keyframes float{50%{translate:0 -12px;rotate:3deg}}@keyframes wiggle{25%{rotate:-12deg;scale:1.1}75%{rotate:12deg;scale:1.1}}@keyframes fall{to{transform:translateY(110vh) rotate(550deg);opacity:0}}@media(max-width:700px){header{padding:0 20px;height:72px}.brand span{display:none}.controls button{padding:8px;font-size:8px}.stage{height:560px}.title{top:140px}h1{letter-spacing:-4px;font-size:clamp(42px,12vw,84px)}.title p{letter-spacing:2px;font-size:8px}.subtitle{font-size:9px}.sign{width:175px;left:3%;top:0}.badge{right:5%;top:30px;width:80px;height:80px}.hero{width:240px;left:calc(50% - 120px);bottom:20px}.shades{width:125px;left:-12px;bottom:10px}.flex{width:175px;right:-22px;bottom:30px}.cards{grid-template-columns:1fr;gap:35px}.card{height:185px}.card img{width:140px;height:160px}.card h3{margin-top:24px}.section-label span{display:none}.dashboards{margin-top:20px}footer{gap:15px;flex-wrap:wrap;font-size:8px}.stars{font-size:25px}}

.card:first-child h3{font-size:20px;line-height:1.08;max-width:205px;margin:25px 0 12px}
@media(max-width:700px){.card:first-child h3{font-size:18px;max-width:180px;margin:20px 0 10px}}

.badge{width:130px;height:130px;text-align:center}.badge span{display:block;font:bold 10px/1.3 Arial,sans-serif;letter-spacing:0}.badge strong{font-size:11px}@media(max-width:700px){.badge{width:112px;height:112px;right:3%;top:24px}.badge span{font-size:9px}.badge strong{font-size:10px}}

a.card{display:block;text-decoration:none;font:inherit;cursor:pointer}