@import "https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&family=Quicksand:wght@500;600;700&display=swap";:root{--font-title:"Quicksand", system-ui, sans-serif;--font-body:"Plus Jakarta Sans", system-ui, sans-serif;--bg-peach:#fdf5ec;--bg-pink:#fbf0f3;--bg-mint:#f0f7f4;--bg-blue:#f0f4f8;--current-bg:var(--bg-peach);transition:background-color .8s}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-body);background-color:var(--current-bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-image:radial-gradient(at 0 0,#d58a6626 0,#0000 50%),radial-gradient(at 100% 100%,#8a572c14 0,#0000 50%);background-attachment:fixed;min-height:100vh;margin:0;transition:background-color .8s;overflow-x:hidden}h1,h2,h3,h4,h5,h6{font-family:var(--font-title);color:#5c3a21}input,button,select,textarea{font-family:var(--font-body)}.app{box-sizing:border-box;flex-direction:column;justify-content:flex-start;align-items:center;min-height:100vh;padding:3rem 1.5rem;display:flex;position:relative;overflow:hidden}.app-title-section{text-align:center;z-index:10;margin-bottom:4rem}.app-title{background:linear-gradient(135deg,#8a572c 0%,#d07a3f 100%);-webkit-text-fill-color:transparent;letter-spacing:-.03em;filter:drop-shadow(0 2px 4px #0000000d);-webkit-background-clip:text;margin-bottom:.5rem;font-size:3rem;font-weight:800}.app-subtitle{color:#8c6239;font-size:1rem;font-weight:500}.animals-container{z-index:4;justify-content:center;align-items:flex-start;width:900px;margin-top:-15px;display:flex;position:relative}.rope-bridge{z-index:10;transform-origin:top;background:0 0;border-bottom:5px solid #8c6239;border-radius:0 0 50% 50%/0 0 35px 35px;height:52px;transition:transform .3s;position:absolute;top:10px;left:25px;right:25px;box-shadow:0 4px 6px #5c3a210f}.rope-wind-none{animation:none!important}.rope-wind-low{animation:3.5s ease-in-out infinite alternate ropeWobbleLow}.rope-wind-medium{animation:2.5s ease-in-out infinite alternate ropeWobbleMedium}.rope-wind-high{animation:1.6s ease-in-out infinite alternate ropeWobbleHigh}@keyframes ropeWobbleLow{0%{transform:translateY(0)scaleY(1)}to{transform:translateY(1.5px)scaleY(.98)}}@keyframes ropeWobbleMedium{0%{transform:translateY(0)scaleY(1)}to{transform:translateY(3.5px)scaleY(.96)}}@keyframes ropeWobbleHigh{0%{transform:translateY(-1.5px)scaleY(1.02)}to{transform:translateY(6px)scaleY(.93)}}.control-panel{-webkit-backdrop-filter:blur(12px);z-index:100;background:#ffffff80;border:1px solid #fff9;border-radius:24px;flex-direction:column;gap:.8rem;padding:1.2rem 2rem;transition:all .3s;display:flex;position:fixed;bottom:2rem;left:50%;transform:translate(-50%);box-shadow:0 10px 30px #5c3a2114,0 1px 3px #5c3a210a}.control-panel:hover{background:#ffffffbf;box-shadow:0 15px 35px #5c3a2126}.control-row{justify-content:space-between;align-items:center;gap:2rem;display:flex}.control-label{color:#5c3a21;text-transform:uppercase;letter-spacing:.05em;font-size:.85rem;font-weight:700}.btn-group{gap:.4rem;display:flex}.btn-control{color:#8c6239;cursor:pointer;background:#fffc;border:1px solid #f0e2d5;border-radius:10px;outline:none;padding:.4rem .8rem;font-size:.8rem;font-weight:700;transition:all .2s}.btn-control:hover{color:#5c3a21;background:#fdf5ec;border-color:#d3a27a}.btn-control.active{color:#fff;background:linear-gradient(135deg,#8a572c 0%,#b88655 100%);border-color:#8a572c;box-shadow:0 4px 10px #8a572c40}.color-picker{gap:.6rem;display:flex}.color-dot{cursor:pointer;border:2px solid #fff;border-radius:50%;width:22px;height:22px;transition:transform .2s,box-shadow .2s;box-shadow:0 2px 5px #0000001a}.color-dot:hover{transform:scale(1.2)}.color-dot.active{transform:scale(1.2);box-shadow:0 0 0 2px #8a572c}.particles-container{pointer-events:none;z-index:1;width:100%;height:100%;position:absolute;top:0;left:0;overflow:hidden}.particle{color:#d58a6640;-webkit-user-select:none;user-select:none;font-size:1rem;animation:linear infinite fallAnimation;position:absolute;top:-20px}@keyframes fallAnimation{0%{opacity:0;transform:translateY(0)translate(0)rotate(0)}10%{opacity:.8}90%{opacity:.8}to{transform:translateY(105vh) translateX(var(--drift,50px)) rotate(360deg);opacity:0}}.animal-wrapper{transform-origin:top;flex-direction:column;align-items:center;width:180px;height:260px;display:flex;position:relative}.pet-position-0{margin-top:10px}.pet-position-1{margin-top:29px}.pet-position-2{margin-top:36px}.pet-position-3{margin-top:29px}.pet-position-4{margin-top:10px}.clothespin{cursor:pointer;z-index:30;transform-origin:top;background-position:50%;background-repeat:no-repeat;background-size:contain;width:18px;height:48px;transition:transform .2s;position:absolute;top:10px}.clothespin:hover{transform:scale(1.1)}.open-clip{animation:.4s cubic-bezier(.25,.46,.45,.94) forwards clipPop!important}@keyframes clipPop{0%{transform:scale(1)rotate(0)}25%{transform:scale(1.25)rotate(-10deg)}65%{transform:scale(.9)rotate(5deg)}to{transform:scale(1)rotate(0)}}.animal-container-wrapper{transform-origin:top;z-index:20;width:140px;height:210px;position:absolute;top:48px}.animal-container{background-position:top;background-repeat:no-repeat;background-size:contain;width:100%;height:100%;transition:filter .3s}.swing-none{animation:none!important}.swing-low{animation:3.5s ease-in-out infinite alternate swingLow}.swing-medium{animation:2.5s ease-in-out infinite alternate swingMedium}.swing-high{animation:1.6s ease-in-out infinite alternate swingHigh}@keyframes swingLow{0%{transform:rotate(-3deg)}to{transform:rotate(3deg)}}@keyframes swingMedium{0%{transform:rotate(-7deg)}to{transform:rotate(7deg)}}@keyframes swingHigh{0%{transform:rotate(-14deg)}to{transform:rotate(14deg)}}.dropped{animation:2.2s ease-in-out forwards gravityFall!important}@keyframes gravityFall{0%{opacity:1;transform:translateY(0)translate(0)rotate(0)scale(1)}20%{opacity:1;transform:translateY(100px)translate(-20px)rotate(-10deg)scale(.95)}50%{opacity:.9;transform:translateY(260px)translate(25px)rotate(15deg)scale(.9)}75%{opacity:.6;transform:translateY(440px)translate(-15px)rotate(-8deg)scale(.85)}to{opacity:0;transform:translateY(620px)translate(10px)rotate(20deg)scale(.8)}}.respawn-balloon{z-index:15;border-radius:50%/40% 40% 60% 60%;justify-content:center;width:44px;height:52px;display:flex;position:absolute;bottom:100%;left:50%;transform:translate(-50%);box-shadow:inset -3px -3px 8px #00000026,0 4px 10px #0000001a}.respawn-balloon:after{content:"";background:#0003;width:1px;height:35px;position:absolute;top:100%}.respawn-balloon:before{content:"";background:#ffffff73;border-radius:50%;width:8px;height:12px;position:absolute;top:8px;left:10px;transform:rotate(-15deg)}.balloon-knot{border-left:5px solid #0000;border-right:5px solid #0000;border-bottom:6px solid var(--balloon-color);width:0;height:0;position:absolute;bottom:-4px;left:50%;transform:translate(-50%)}.balloon-color-0{--balloon-color:#ffb7b2;background-color:#ffb7b2}.balloon-color-1{--balloon-color:#ffdac1;background-color:#ffdac1}.balloon-color-2{--balloon-color:#e2f0cb;background-color:#e2f0cb}.balloon-color-3{--balloon-color:#b5ead7;background-color:#b5ead7}.balloon-color-4{--balloon-color:#c7ceea;background-color:#c7ceea}.respawning{animation:2.6s cubic-bezier(.25,.8,.25,1) forwards balloonFloatDown!important}@keyframes balloonFloatDown{0%{opacity:0;transform:translateY(-500px)rotate(-10deg)}15%{opacity:1}50%{transform:translateY(-200px)rotate(5deg)}75%{transform:translateY(-70px)rotate(-3deg)}to{opacity:1;transform:translateY(0)rotate(0)}}.clicked-bounce .animal-container{animation:.6s cubic-bezier(.175,.885,.32,1.275) clickBounce!important}@keyframes clickBounce{0%{transform:scale(1)}30%{transform:scale(1.15)translateY(-12px)}60%{transform:scale(.96)translateY(3px)}to{transform:scale(1)translateY(0)}}.animal-wrapper:hover .animal-container-wrapper{transform:scale(1.06)}.animal-wrapper:hover .animal-container{filter:drop-shadow(0 8px 12px #8c623938)}.chat-bubble{color:#5c3a21;white-space:nowrap;opacity:0;pointer-events:none;z-index:50;background:#fff;border:2px solid #f0e2d5;border-radius:14px;padding:.5rem .8rem;font-size:.8rem;font-weight:700;transition:opacity .3s cubic-bezier(.175,.885,.32,1.275),transform .3s cubic-bezier(.175,.885,.32,1.275);position:absolute;top:-30px;transform:translateY(10px)scale(.8);box-shadow:0 6px 20px #5c3a211f}.chat-bubble:after{content:"";border:6px solid #0000;border-top-color:#fff;position:absolute;top:100%;left:50%;transform:translate(-50%)}.chat-bubble:before{content:"";z-index:-1;border:8px solid #0000;border-top-color:#f0e2d5;position:absolute;top:100%;left:50%;transform:translate(-50%)}.annoyed-bubble{color:#c0392b!important;opacity:1!important;background:#ffebeb!important;border-color:#fcc!important;animation:.15s ease-in-out infinite alternate bubbleShake!important;transform:translateY(0)scale(1)!important}.annoyed-bubble:after{border-color:#ffebeb #0000 #0000!important}.annoyed-bubble:before{border-color:#fcc #0000 #0000!important}@keyframes bubbleShake{0%{transform:translateY(0)rotate(-1.5deg)}to{transform:translateY(0)rotate(1.5deg)}}.clicked-spin .animal-container{animation:.8s cubic-bezier(.25,1,.5,1) forwards spin360!important}@keyframes spin360{0%{transform:rotate(0)scale(1)}30%{transform:rotate(180deg)scale(1.15)}to{transform:rotate(360deg)scale(1)}}.animal-wrapper:hover .chat-bubble{opacity:1;transform:translateY(0)scale(1)}.click-heart{-webkit-user-select:none;user-select:none;pointer-events:none;z-index:100;font-size:1.5rem;animation:1s cubic-bezier(.25,.46,.45,.94) forwards flyUpAndFade;position:absolute}@keyframes flyUpAndFade{0%{opacity:1;transform:translateY(0)scale(.5)rotate(0)}50%{opacity:.8}to{transform:translateY(-90px) scale(1.3) rotate(var(--heart-rot,15deg));opacity:0}}.drop-particle{-webkit-user-select:none;user-select:none;pointer-events:none;z-index:120;font-size:1.4rem;animation:.8s cubic-bezier(.175,.885,.32,1.275) forwards scatterParticle;position:absolute}@keyframes scatterParticle{0%{opacity:1;transform:translate(0)scale(.3)rotate(0)}to{transform:translate(var(--p-dx), var(--p-dy)) scale(1.1) rotate(180deg);opacity:0}}