.app{display:flex;flex-direction:column;height:100dvh;max-width:480px;margin:0 auto;background:var(--cream);position:relative;overflow:hidden}.header{display:flex;justify-content:space-between;align-items:center;padding:16px 20px 12px;border-bottom:1px solid var(--hay);flex-shrink:0}.logo{display:flex;align-items:center;gap:8px}.logo-icon{font-size:24px}.logo-text{font-family:Playfair Display,serif;font-size:22px;font-weight:700;color:var(--saddle);letter-spacing:-.5px}.back-btn{background:none;font-size:15px;color:var(--earth);font-weight:500;padding:6px 12px;border-radius:20px;border:1px solid var(--hay)}.likes-btn{position:relative;background:var(--saddle);color:#fff;width:44px;height:44px;border-radius:50%;font-size:18px;display:flex;align-items:center;justify-content:center;transition:transform .2s}.likes-btn:hover{transform:scale(1.08)}.badge{position:absolute;top:-4px;right:-4px;background:var(--rose);color:#fff;font-size:10px;font-weight:700;width:18px;height:18px;border-radius:50%;display:flex;align-items:center;justify-content:center}.card-area{flex:1;position:relative;padding:12px 16px 0;min-height:0}.card{position:absolute;top:12px;right:16px;bottom:0;left:16px;border-radius:24px;border:1px solid rgba(139,94,60,.12);box-shadow:0 8px 32px #2c18101a;display:flex;flex-direction:column;overflow:hidden;-webkit-user-select:none;user-select:none;cursor:grab;transition:transform .08s ease}.card:active{cursor:grabbing}.card-behind{z-index:0;transform:scale(.96) translateY(8px);cursor:default;pointer-events:none}.card:not(.card-behind){z-index:1}@keyframes swipeRight{to{transform:translate(130%) rotate(20deg);opacity:0}}@keyframes swipeLeft{to{transform:translate(-130%) rotate(-20deg);opacity:0}}.swipe-right{animation:swipeRight .4s ease forwards}.swipe-left{animation:swipeLeft .4s ease forwards}.stamp{position:absolute;top:20px;font-family:Playfair Display,serif;font-size:28px;font-weight:700;padding:6px 16px;border-radius:8px;border:4px solid;transform:rotate(-12deg);z-index:10;letter-spacing:2px;pointer-events:none}.stamp-like{left:16px;color:var(--grass);border-color:var(--grass);background:#4a7c5914}.stamp-nope{right:16px;color:var(--rose);border-color:var(--rose);background:#e8736a14;transform:rotate(12deg)}.card-top{position:relative;padding:20px 20px 12px;display:flex;justify-content:center}.horse-avatar{width:130px;height:130px;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 20px #00000026}.horse-emoji-big{font-size:68px}.distance-badge{position:absolute;bottom:8px;right:16px;background:#ffffffe6;border:1px solid var(--hay);padding:4px 10px;border-radius:20px;font-size:11px;font-weight:500;color:var(--earth)}.card-info{flex:1;padding:4px 20px 16px;overflow-y:auto;scrollbar-width:none}.card-info::-webkit-scrollbar{display:none}.name-row{display:flex;align-items:baseline;gap:10px;margin-bottom:4px}.horse-name{font-family:Playfair Display,serif;font-size:26px;font-weight:700;color:var(--saddle);line-height:1}.horse-age{font-size:22px;font-weight:300;color:var(--earth)}.breed-vibe{display:flex;align-items:center;gap:6px;margin-bottom:10px;font-size:13px;color:var(--earth);font-weight:400}.dot{opacity:.4}.vibe-tag{display:inline-block;padding:4px 12px;border-radius:20px;font-size:12px;font-weight:500;margin-bottom:10px;font-style:italic}.bio{font-size:13.5px;line-height:1.6;color:#5c4030;margin-bottom:12px}.traits{display:flex;flex-wrap:wrap;gap:6px}.trait{padding:4px 12px;border-radius:20px;border:1.5px solid;font-size:11px;font-weight:500;letter-spacing:.3px}.actions{display:flex;justify-content:center;gap:24px;padding:10px 20px 4px;flex-shrink:0}.btn-pass,.btn-like{width:64px;height:64px;border-radius:50%;font-size:24px;display:flex;align-items:center;justify-content:center;transition:transform .15s,box-shadow .15s;box-shadow:0 4px 16px #0000001f}.btn-pass{background:#fff;border:2px solid #FFBBBB;color:var(--rose)}.btn-pass:hover{transform:scale(1.1);box-shadow:0 6px 20px #e8736a4d}.btn-like{background:var(--saddle);border:2px solid var(--saddle)}.btn-like:hover{transform:scale(1.1);box-shadow:0 6px 20px #5c3d1e59}.progress-row{padding:6px 20px 12px;display:flex;flex-direction:column;gap:4px;flex-shrink:0}.progress-text{font-size:11px;color:var(--earth);opacity:.7;text-align:center}.progress-bar{height:3px;background:var(--hay);border-radius:2px;overflow:hidden}.progress-fill{height:100%;background:var(--earth);border-radius:2px;transition:width .4s ease}.empty-state{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:32px;text-align:center}.empty-horse{font-size:72px;animation:bob 2s ease-in-out infinite}@keyframes bob{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.empty-state h2{font-family:Playfair Display,serif;font-size:22px;color:var(--saddle)}.empty-state p{color:var(--earth);font-size:14px;line-height:1.6}.reset-btn{margin-top:8px;background:var(--saddle);color:#fff;padding:12px 28px;border-radius:40px;font-size:15px;font-weight:500;letter-spacing:.3px;transition:transform .15s}.reset-btn:hover{transform:scale(1.04)}.likes-grid{flex:1;overflow-y:auto;padding:20px 16px}.likes-title{font-family:Playfair Display,serif;font-size:22px;color:var(--saddle);margin-bottom:16px}.empty-msg{color:var(--earth);font-size:14px;text-align:center;margin-top:48px}.grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.mini-card{border-radius:16px;border:1.5px solid;padding:16px 12px;display:flex;flex-direction:column;align-items:center;gap:8px}.mini-emoji{width:56px;height:56px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:28px}.mini-name{font-family:Playfair Display,serif;font-size:15px;color:var(--saddle);font-weight:700;text-align:center}.mini-breed{font-size:11px;color:var(--earth);text-align:center}.match-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#2c181099;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:100;animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.match-popup{background:var(--cream);border-radius:28px;padding:36px 28px;margin:24px;max-width:340px;width:100%;text-align:center;box-shadow:0 24px 64px #2c18104d;animation:popIn .35s cubic-bezier(.34,1.56,.64,1)}@keyframes popIn{0%{transform:scale(.7);opacity:0}to{transform:scale(1);opacity:1}}.match-sparkles{font-size:32px;margin-bottom:8px;animation:sparkle 1s ease-in-out infinite alternate}@keyframes sparkle{0%{transform:scale(1)}to{transform:scale(1.1) rotate(5deg)}}.match-title{font-family:Playfair Display,serif;font-size:32px;color:var(--saddle);margin-bottom:20px}.match-avatar{width:100px;height:100px;border-radius:50%;margin:0 auto 16px;display:flex;align-items:center;justify-content:center;font-size:52px;box-shadow:0 8px 24px #00000026}.match-name{font-family:Playfair Display,serif;font-size:18px;color:var(--saddle);margin-bottom:6px}.match-sub{font-size:13px;color:var(--earth);margin-bottom:24px;opacity:.8}.match-btn{background:var(--saddle);color:#fff;padding:14px 32px;border-radius:40px;font-size:15px;font-weight:500;width:100%;transition:transform .15s}.match-btn:hover{transform:scale(1.03)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--hay: #F5E6C8;--wheat: #E8C97A;--earth: #8B5E3C;--saddle: #5C3D1E;--grass: #4A7C59;--sky: #7BB8D4;--rose: #E8736A;--cream: #FBF6EE;--dark: #2C1810}html,body,#root{height:100%;width:100%}body{font-family:DM Sans,sans-serif;background:var(--cream);color:var(--dark);overflow:hidden}button{cursor:pointer;font-family:inherit;border:none;outline:none}
