:root{--color-bg: #EDE8E2;--color-surface: #FFFFFF;--color-primary: #7B6653;--color-secondary: #A89F91;--color-text: #3A3A3A;--color-text-muted: #666666;--font-family: "Inter", sans-serif;--radius: 12px;--shadow: 0 4px 20px rgba(123, 102, 83, .15)}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--color-bg);color:var(--color-text);font-family:var(--font-family);-webkit-font-smoothing:antialiased;overflow-x:hidden}button{cursor:pointer;border:none;outline:none;font-family:inherit}input{font-family:inherit;outline:none}.container{max-width:1200px;margin:0 auto;padding:20px}.card{background:var(--color-surface);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow);border:1px solid rgba(123,102,83,.1)}.btn{padding:12px 24px;border-radius:var(--radius);font-weight:600;transition:transform .2s,opacity .2s,box-shadow .2s}.btn:active{transform:scale(.98)}.btn-primary{background:var(--color-primary);color:#ede8e2;box-shadow:0 4px 10px #7b66534d}.btn-secondary{background:#7b66531a;color:var(--color-primary)}.input{width:100%;padding:16px;background:#fff;border:2px solid rgba(123,102,83,.2);border-radius:var(--radius);color:var(--color-text);font-size:16px;transition:border-color .2s,box-shadow .2s}.input:focus{border-color:var(--color-primary);box-shadow:0 0 0 4px #7b66531a}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes elasticPop{0%{transform:scale(0);opacity:0}50%{transform:scale(1.1);opacity:1}70%{transform:scale(.95)}to{transform:scale(1);opacity:1}}@keyframes organicFloat{0%{transform:translate(0) rotate(0)}33%{transform:translate(10px,-15px) rotate(2deg)}66%{transform:translate(-5px,10px) rotate(-1deg)}to{transform:translate(0) rotate(0)}}@keyframes shimmer{0%{background-position:-200% center}to{background-position:200% center}}.animate-elastic-pop{animation:elasticPop .8s cubic-bezier(.175,.885,.32,1.275) forwards}.animate-organic-float{animation:organicFloat 6s ease-in-out infinite}.bubble-text-container{width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:1rem;overflow:hidden}.bubble-city-name{word-break:break-word;line-height:1.2;font-weight:700;color:var(--text-primary)}.bubble-count{font-weight:800;color:var(--primary-brown);margin-top:.25rem}.glass-bubble{background:linear-gradient(135deg,#fff,#f5f5f5e6);box-shadow:0 8px 32px #7b665333,inset 0 0 0 1px #ffffff80;position:relative;overflow:hidden}.glass-bubble:after{content:"";position:absolute;top:0;left:-100%;width:50%;height:100%;background:linear-gradient(to right,#fff0,#fff6,#fff0);transform:skew(-25deg);animation:shimmer 3s infinite}.rounded-full{border-radius:9999px}.rounded-pill{border-radius:50px}.shape-blob-1{border-radius:50%/60% 60% 40% 40%;transform:scale(1.1)}.shape-blob-2{border-radius:60% 40% 40% 60%/60% 50% 50% 40%}.shape-blob-3{border-radius:45% 55% 50% 50%/55% 60% 40% 45%}.shape-organic-pill{border-radius:100px}.bubble-theme-light{background:linear-gradient(135deg,#fff,#f5f5f5);color:var(--color-text);border:1px solid rgba(123,102,83,.2)}.bubble-theme-light .bubble-count{color:var(--color-primary)}.bubble-theme-beige{background:linear-gradient(135deg,#ede8e2,#e0d8d0);color:var(--color-text);border:1px solid rgba(123,102,83,.3)}.bubble-theme-beige .bubble-count{color:var(--color-primary)}.bubble-theme-brown{background:linear-gradient(135deg,#7b6653,#655241);color:#ede8e2;border:1px solid rgba(255,255,255,.2)}.bubble-theme-brown .bubble-count{color:#fff}.bubble-theme-dark{background:linear-gradient(135deg,#3a3a3a,#2c2c2c);color:#ede8e2;border:1px solid rgba(255,255,255,.1)}.bubble-theme-dark .bubble-count{color:#fff}@keyframes shockwave{0%{box-shadow:0 0 #ffffffb3}70%{box-shadow:0 0 0 30px #fff0}to{box-shadow:0 0 #fff0}}.animate-shockwave{animation:shockwave 1s ease-out}.blur-sm{filter:blur(.5px);opacity:.95}.blur-md{filter:blur(1px);opacity:.9}.particle-container{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:1}.particle{position:absolute;background:#ffffff4d;border-radius:50%;animation:floatParticle 20s linear infinite}@keyframes floatParticle{0%{transform:translateY(0) rotate(0);opacity:0}10%{opacity:.5}90%{opacity:.5}to{transform:translateY(-100vh) rotate(360deg);opacity:0}}@keyframes shake{0%{transform:translate(0) rotate(0)}10%{transform:translate(-2px,-2px) rotate(-1deg)}20%{transform:translate(2px,2px) rotate(1deg)}30%{transform:translate(-2px,2px) rotate(0)}40%{transform:translate(2px,-2px) rotate(1deg)}50%{transform:translate(-1px,2px) rotate(-1deg)}60%{transform:translate(-3px,1px) rotate(0)}70%{transform:translate(3px,1px) rotate(-1deg)}80%{transform:translate(-1px,-1px) rotate(1deg)}90%{transform:translate(1px,2px) rotate(0)}to{transform:translate(0) rotate(0)}}.animate-shake{animation:shake 3s ease-in-out infinite}
