*{box-sizing:border-box;margin:0;padding:0}body,html{color:#111;background-color:#fffaf0;background-image:radial-gradient(#ccc 2px,#0000 2px);background-size:30px 30px;width:100vw;height:100dvh;font-family:Comic Sans MS,Chalkboard SE,Casual,Proportional Sans-Serif,sans-serif;overflow:hidden}.container{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:clamp(2.5rem,6vh,4.5rem);width:100vw;height:100dvh;padding:clamp(1rem,3vh,2.5rem);display:flex}.logo{letter-spacing:-2px;color:#f33;text-transform:lowercase;text-shadow:clamp(3px,1vw,6px) clamp(3px,1vw,6px) #000;margin-bottom:-.5rem;font-size:clamp(4rem,12vw,6.5rem);font-weight:900;transform:rotate(-4deg)}h2{color:#000;background-color:#0ff;border:3px solid #000;border-radius:255px 15px 225px/15px 225px 15px 255px;padding:clamp(.4rem,1.5vh,.5rem) clamp(1rem,3vw,1.5rem);font-size:clamp(.9rem,3vw,1.3rem);font-weight:700;transform:rotate(2deg);box-shadow:4px 4px #000}.quote{color:#000;background-color:#ffb3ff;border:4px solid #000;border-radius:15px 225px 15px 255px/255px 15px 225px;width:90%;max-width:600px;padding:clamp(1rem,3vh,1.5rem) clamp(1rem,4vw,2.5rem);font-size:clamp(.95rem,3vw,1.3rem);font-weight:700;line-height:1.5;transform:rotate(-1.5deg);box-shadow:6px 6px #000}.btn{color:#000;cursor:pointer;text-transform:uppercase;letter-spacing:2px;background-color:#3f3;border:4px solid #000;border-radius:225px 15px 255px/15px 255px 15px 225px;padding:clamp(.8rem,2vh,1rem) clamp(2rem,5vw,3.5rem);font-family:inherit;font-size:clamp(1.1rem,3vw,1.3rem);font-weight:900;transition:transform .1s,box-shadow .1s;transform:rotate(3deg);box-shadow:6px 6px #000}.btn:hover{background-color:#1ae61a;transform:rotate(0)translate(3px,3px);box-shadow:2px 2px #000}.counter-wrapper{color:#000;background-color:#fff;border:3px dashed #000;border-radius:15px;padding:.5rem clamp(1rem,3vw,1.5rem);font-size:clamp(.9rem,2.5vw,1.1rem);font-weight:700;transform:rotate(-2deg);box-shadow:3px 3px #0003}.counter-number{color:#f33;margin-left:.5rem;font-size:clamp(1.2rem,3vw,1.5rem);font-weight:900}.modal-overlay{z-index:1000;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background-color:#0009;justify-content:center;align-items:center;width:100vw;height:100dvh;padding:1rem;display:flex;position:fixed;top:0;left:0}.modal-content{text-align:left;background-color:#fff;border:5px solid #000;border-radius:25px 255px 15px/255px 15px 225px;width:100%;max-width:450px;max-height:90dvh;padding:clamp(1.5rem,4vh,2.5rem);position:relative;overflow-y:auto;transform:rotate(1deg);box-shadow:10px 10px #f33}.modal-content::-webkit-scrollbar{width:8px}.modal-content::-webkit-scrollbar-thumb{background-color:#f33;border-radius:10px}.success-modal{text-align:center;transform:rotate(-2deg);box-shadow:10px 10px #3f3}.close-btn{color:#000;cursor:pointer;z-index:10;background:0 0;border:none;font-family:inherit;font-size:1.8rem;font-weight:700;position:absolute;top:10px;right:15px}.modal-content h3{margin-bottom:.5rem;font-size:clamp(1.4rem,4vw,1.8rem);transform:rotate(-1.5deg)}.modal-content p{color:#444;margin-bottom:1.5rem;font-size:clamp(.95rem,3vw,1.1rem)}.success-quote{color:#f33;margin:1.5rem 0;font-size:clamp(1.1rem,3.5vw,1.4rem);font-weight:700}.doodle-input{background:#fffaf0;border:3px solid #000;border-radius:255px 15px 225px/15px 225px 15px 255px;outline:none;width:100%;margin-bottom:.5rem;padding:clamp(.6rem,2vh,.8rem);font-family:inherit;font-size:clamp(1rem,3vw,1.1rem)}.doodle-input:focus{background:#e6ffff}.error-text{color:#f33;margin-bottom:1rem;font-size:.85rem;font-weight:700;display:block}.submit-btn{color:#000;cursor:pointer;text-transform:uppercase;background-color:#0ff;border:3px solid #000;border-radius:15px 225px 15px 255px/255px 15px 225px;width:100%;margin-top:.5rem;padding:clamp(.6rem,2vh,.8rem);font-family:inherit;font-size:clamp(1.1rem,3vw,1.2rem);font-weight:700;transition:all .1s;box-shadow:4px 4px #000}.submit-btn:hover{transform:translate(2px,2px);box-shadow:2px 2px #000}.submit-btn:disabled{cursor:not-allowed;background-color:#ccc}
