:root{--yellow:#ffd93d;--yellow-dark:#f4a92a;--yellow-light:#fff9d6;--blue-deep:#1e7fc6;--blue-mid:#4bb3e6;--white:#fffef7;--black:#1a1200;--outline:3px solid var(--black);--shadow:5px 5px 0px var(--black);--radius:18px}*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{background:radial-gradient(circle,#9bdcff 0%,#4bb3e6 40%,#1e7fc6 100%);min-height:100vh;font-family:Comic Neue,cursive;overflow-x:hidden}.bubbles{pointer-events:none;z-index:0;position:fixed;inset:0;overflow:hidden}.bubble{background:radial-gradient(circle at 35% 35%,#ffffff8c,#ffffff14);border:2px solid #ffffff59;border-radius:50%;animation:linear infinite rise;position:absolute;bottom:-120px}.bubble:first-child{width:44px;height:44px;animation-duration:9s;animation-delay:0s;left:8%}.bubble:nth-child(2){width:22px;height:22px;animation-duration:6.5s;animation-delay:2.5s;left:22%}.bubble:nth-child(3){width:64px;height:64px;animation-duration:11s;animation-delay:1s;left:48%}.bubble:nth-child(4){width:32px;height:32px;animation-duration:7.5s;animation-delay:3.5s;left:68%}.bubble:nth-child(5){width:52px;height:52px;animation-duration:10s;animation-delay:.8s;left:83%}.bubble:nth-child(6){width:28px;height:28px;animation-duration:7s;animation-delay:4.5s;left:38%}@keyframes rise{0%{opacity:.75;transform:translateY(0)scale(1)}to{opacity:0;transform:translateY(-110vh)scale(1.1)}}#app{z-index:1;flex-direction:column;align-items:center;max-width:700px;min-height:100vh;margin:0 auto;padding:2.5rem 1.25rem 3.5rem;display:flex;position:relative}.app-main{flex-direction:column;align-items:center;width:100%;display:flex}.app-header{text-align:center;margin-bottom:2.75rem;animation:.65s cubic-bezier(.34,1.56,.64,1) both dropIn}.sponge-icon{filter:drop-shadow(3px 4px #00000040);margin-bottom:.5rem;font-size:4.5rem;line-height:1;animation:3.5s ease-in-out infinite wobble;display:block}@keyframes wobble{0%,to{transform:rotate(-6deg)scale(1)}50%{transform:rotate(6deg)scale(1.08)}}.app-title{color:var(--yellow);text-shadow:3px 3px 0 var(--black), -1px -1px 0 var(--black), 1px -1px 0 var(--black), -1px 1px 0 var(--black), 1px 1px 0 var(--black);font-family:Fredoka One,cursive;font-size:clamp(2rem,9vw,3rem);line-height:1.05}.input-card,.preview-card{border-radius:var(--radius);border:var(--outline);width:100%;box-shadow:var(--shadow);padding:1.625rem 1.75rem}.input-card{background:var(--yellow);animation:.55s cubic-bezier(.34,1.56,.64,1) .1s both slideUp}.preview-card{background:var(--white);animation:.55s cubic-bezier(.34,1.56,.64,1) .22s both slideUp}.preview-copy{position:absolute;top:.5rem;right:.5rem}.preview-copy button{appearance:none;color:#0006;background-color:#0000;border:none;border-radius:.25rem;width:32px;height:32px;padding:.25rem;line-height:1}.preview-copy button:hover{color:#000000b3;background-color:#0000000d}.preview-copy button:active{background-color:#0000001a}.preview-copy svg{width:16px;height:16px}@keyframes dropIn{0%{opacity:0;transform:translateY(-36px)}to{opacity:1;transform:translateY(0)}}@keyframes slideUp{0%{opacity:0;transform:translateY(28px)}to{opacity:1;transform:translateY(0)}}.input-label{color:var(--black);letter-spacing:.4px;margin-bottom:.75rem;font-family:Fredoka One,cursive;font-size:1rem;display:block}.text-input{border:2px solid var(--black);background:var(--yellow-light);width:100%;color:var(--black);resize:vertical;border-radius:10px;outline:none;min-height:80px;padding:.875rem 1rem;font-family:Comic Neue,cursive;font-size:1.2rem;font-weight:600;transition:box-shadow .15s;box-shadow:inset 2px 2px #00000014}.text-input:focus{box-shadow:inset 2px 2px #00000014,0 0 0 3px #1e7fc659}.text-input::placeholder{color:#9a7a2e;font-weight:400}.random-btn{margin-top:.75rem;border:2px solid var(--black);background:var(--yellow-dark);letter-spacing:1px;color:var(--black);cursor:pointer;box-shadow:var(--shadow);border-radius:10px;margin-inline:auto;padding:.5rem 1.1rem;font-family:Fredoka One,cursive;font-size:1rem;transition:transform .1s,box-shadow .1s;display:block}.random-btn:hover{box-shadow:7px 7px 0px var(--black);transform:translate(-2px,-2px)}.random-btn:active{box-shadow:2px 2px 0px var(--black);transform:translate(3px,3px)}.arrow-divider{color:var(--white);text-shadow:1px 1px 0 var(--black), 2px 2px 0 var(--black), 3px 3px 0 var(--black);margin:1rem 0 1.5rem;font-size:3rem;animation:3s ease-in-out infinite bounce}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(7px)}}.preview-label{letter-spacing:2px;color:var(--blue-deep);margin-bottom:.875rem;font-family:Fredoka One,cursive;font-size:.9rem}.preview-text{letter-spacing:.5px;color:var(--black);word-break:break-word;min-height:64px;font-family:Comic Neue,Comic Sans MS,cursive;font-size:clamp(1.25rem,3.5vw,1.75rem);font-weight:700;line-height:1.45}.app-footer{color:#ffffffa6;margin-top:2.25rem;font-family:Comic Neue,cursive;font-size:.85rem}@media (width<=480px){#app{padding:1.75rem 1rem 2.5rem}.input-card,.preview-card{padding:1.25rem}}