*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0;padding:0;overflow-x:hidden}#root{width:100%;min-height:100vh}button{font-family:inherit}.card{position:absolute;width:100%;max-width:400px;height:600px;border-radius:20px;overflow:hidden;box-shadow:0 10px 30px #0000004d;cursor:grab;-webkit-user-select:none;user-select:none;transition:transform .3s ease,opacity .3s ease;background:#fff}.card:active{cursor:grabbing}.card.active{z-index:10}.card-photos{position:relative;width:100%;height:100%}.card-image{width:100%;height:100%;object-fit:cover;display:block}.photo-nav{position:absolute;top:50%;transform:translateY(-50%);background:#fffc;border:none;width:50px;height:50px;border-radius:50%;font-size:24px;cursor:pointer;z-index:2;display:flex;align-items:center;justify-content:center;transition:background .2s}.photo-nav:hover{background:#fff}.photo-nav.prev{left:10px}.photo-nav.next{right:10px}.photo-indicators{position:absolute;bottom:20px;left:50%;transform:translate(-50%);display:flex;gap:8px;z-index:2}.indicator{width:8px;height:8px;border-radius:50%;background:#ffffff80;transition:background .2s}.indicator.active{background:#fff;width:24px;border-radius:4px}.card-overlay{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(to top,rgba(0,0,0,.8) 0%,rgba(0,0,0,.4) 50%,transparent 100%);padding:30px 20px 20px;color:#fff}.card-info{display:flex;flex-direction:column;gap:8px}.card-name{margin:0;font-size:32px;font-weight:700;text-shadow:0 2px 4px rgba(0,0,0,.3)}.card-location{margin:0;font-size:16px;opacity:.9}.card-bio{margin:8px 0 0;font-size:16px;line-height:1.4;opacity:.95}.swipe-label{position:absolute;top:50px;font-size:60px;font-weight:900;text-transform:uppercase;letter-spacing:4px;z-index:20;pointer-events:none;text-shadow:0 2px 10px rgba(0,0,0,.3)}.swipe-label.like{right:30px;color:#4ade80;border:4px solid #4ade80;padding:10px 20px;border-radius:10px;transform:rotate(15deg)}.swipe-label.nope{left:30px;color:#f87171;border:4px solid #f87171;padding:10px 20px;border-radius:10px;transform:rotate(-15deg)}@media(max-width:480px){.card{height:500px}.card-name{font-size:28px}.swipe-label{font-size:40px}}.swipe-container{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:70vh;padding:20px;position:relative}.swipe-container.empty{min-height:50vh}.empty-state{text-align:center;color:#666;padding:40px 20px}.empty-state h2{margin:0 0 10px;font-size:28px;color:#333}.empty-state p{margin:0;font-size:16px}.cards-stack{position:relative;width:100%;max-width:400px;height:600px;margin-bottom:30px}.action-buttons{display:flex;gap:30px;justify-content:center;align-items:center}.action-btn{width:60px;height:60px;border-radius:50%;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:transform .2s,box-shadow .2s;box-shadow:0 4px 12px #00000026}.action-btn:active{transform:scale(.9)}.action-btn:hover{transform:scale(1.1);box-shadow:0 6px 20px #0003}.nope-btn{background:#fff;color:#f87171;border:3px solid #f87171}.nope-btn:hover{background:#f87171;color:#fff}.like-btn{background:#fff;color:#4ade80;border:3px solid #4ade80}.like-btn:hover{background:#4ade80;color:#fff}@media(max-width:480px){.cards-stack{height:500px}.action-btn{width:55px;height:55px}.action-buttons{gap:25px}}.matches-overlay{position:fixed;inset:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}.matches-modal{background:#fff;border-radius:20px;width:100%;max-width:600px;max-height:80vh;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 20px 60px #0000004d}.matches-header{display:flex;justify-content:space-between;align-items:center;padding:20px 24px;border-bottom:1px solid #e5e7eb}.matches-header h2{margin:0;font-size:24px;color:#333}.close-btn{background:none;border:none;font-size:32px;color:#666;cursor:pointer;width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:background .2s}.close-btn:hover{background:#f3f4f6;color:#333}.empty-matches{padding:60px 24px;text-align:center;color:#666}.empty-matches p{margin:0 0 10px;font-size:18px}.empty-matches .subtitle{font-size:14px;color:#999}.matches-grid{padding:20px;overflow-y:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:16px}.match-card{background:#f9fafb;border-radius:12px;overflow:hidden;cursor:pointer;transition:transform .2s,box-shadow .2s}.match-card:hover{transform:translateY(-4px);box-shadow:0 8px 16px #0000001a}.match-photo{width:100%;height:200px;object-fit:cover;display:block}.match-info{padding:12px}.match-info h3{margin:0 0 4px;font-size:16px;color:#333}.match-date{margin:0;font-size:12px;color:#999}@media(max-width:480px){.matches-grid{grid-template-columns:repeat(2,1fr)}.match-photo{height:150px}}.app{min-height:100vh;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;flex-direction:column}.app-header{display:flex;justify-content:space-between;align-items:center;padding:20px;background:#ffffff1a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 2px 10px #0000001a}.app-title{margin:0;font-size:32px;font-weight:700;color:#fff;text-shadow:0 2px 4px rgba(0,0,0,.2)}.matches-button{position:relative;background:#fff;border:none;width:50px;height:50px;border-radius:50%;font-size:24px;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px #0003;transition:transform .2s}.matches-button:hover{transform:scale(1.1)}.matches-badge{position:absolute;top:-5px;right:-5px;background:#ef4444;color:#fff;font-size:12px;font-weight:700;width:20px;height:20px;border-radius:50%;display:flex;align-items:center;justify-content:center;border:2px solid white}.app-main{flex:1;display:flex;align-items:center;justify-content:center;padding:20px}@media(max-width:480px){.app-title{font-size:24px}.matches-button{width:45px;height:45px;font-size:20px}}
