*{margin:0;padding:0;box-sizing:border-box}html{height:100%}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.6;min-height:100%;background:inherit}#root{min-height:100vh;margin:0 auto;max-width:800px;display:flex}.app-container{margin:0 auto;align-items:center;padding:0}.main-content{padding:2rem;max-width:800px;width:100%;justify-content:center;align-items:center}.screen{min-height:100vh}.screen-header{display:none;position:relative;border-bottom-left-radius:3rem;border-bottom-right-radius:3rem;padding:2rem}.status-bar{display:flex;justify-content:space-between;align-items:center;color:#fff;font-size:.875rem;font-weight:500;margin-bottom:2rem}.status-icons{display:flex;align-items:center;gap:.25rem}.status-dot{width:.25rem;height:.25rem;background-color:#fff;border-radius:50%}.status-battery{width:1rem;height:.5rem;background-color:#fff;border-radius:.125rem}.decorative-circle-1{position:absolute;top:2rem;right:2rem;width:6rem;height:6rem;background-color:#f472b6;border-radius:50%;opacity:.3}.decorative-circle-2{position:absolute;top:5rem;right:4rem;width:4rem;height:4rem;background-color:#c084fc;border-radius:50%;opacity:.4}.screen-title{color:#fff;font-size:1.5rem;font-weight:700;text-align:center;margin-top:1rem}.main-card{position:relative;margin:0rem 0 6rem;background-color:#fff;border-radius:1.5rem;box-shadow:0 25px 50px -12px #00000040;padding:1.5rem;width:100%}.welcome-section{text-align:center;margin-bottom:2rem}.welcome-title{font-size:1.5rem;font-weight:700;color:#1f2937;margin-bottom:.5rem}.welcome-subtitle{color:#6b7280;font-size:.875rem;margin-bottom:1.5rem}.benefits-list{text-align:left;margin:1.5rem 0}.benefit-item{display:flex;align-items:flex-start;gap:.75rem;margin-bottom:1rem;padding:.75rem;background-color:#f9fafb;border-radius:.75rem}.benefit-icon{font-size:1.25rem;min-width:2rem;text-align:center}.benefit-item h3{font-size:.875rem;font-weight:600;color:#374151;margin-bottom:.25rem}.benefit-item p{font-size:.75rem;color:#6b7280;line-height:1.4}.login-prompt{color:#6b7280;font-size:.875rem;margin-bottom:1.5rem}.profile-card{padding:1rem}.profile-info-box{position:relative;margin-bottom:1.5rem;padding:1rem;background-color:#eff6ff;border:1px solid #bfdbfe;border-radius:.75rem}.profile-info-dismiss{position:absolute;top:.5rem;right:.5rem;background:none;border:none;font-size:1.25rem;color:#6b7280;cursor:pointer;padding:.25rem;line-height:1;border-radius:.25rem;transition:all .2s ease-in-out;width:1.5rem;height:1.5rem;display:flex;align-items:center;justify-content:center}.profile-info-dismiss:hover{background-color:#d1d5db;color:#374151}.profile-info-content{display:flex;align-items:flex-start;gap:.75rem}.profile-info-icon{font-size:1.25rem;flex-shrink:0}.profile-info-text{flex:1}.profile-info-title{color:#1e40af;font-weight:600;font-size:.875rem;margin-bottom:.5rem;margin-top:0}.profile-info-list{color:#1d4ed8;font-size:.75rem;line-height:1.5;margin:0 0 .75rem;padding-left:0;list-style:none}.profile-info-list li{margin-bottom:.25rem}.profile-info-tip{color:#2563eb;font-size:.75rem;margin:0;font-weight:500}.category-section{margin-bottom:2rem;padding-bottom:1.5rem;border-bottom:1px solid #f3f4f6}.category-section:last-of-type{border-bottom:none;margin-bottom:1rem}.category-title{font-size:1.125rem;font-weight:600;color:#374151;margin-bottom:1rem;padding-bottom:.5rem;border-bottom:2px solid #e5e7eb}.profile-submit{margin-top:1.5rem;margin-bottom:2rem}.matches-card{padding:1rem}.matches-intro{text-align:center;margin-bottom:1.5rem}.matches-subtitle{color:#6b7280;font-size:.875rem;line-height:1.5}.matches-list{display:flex;flex-direction:column;gap:1rem}.match-card{display:flex;align-items:flex-start;gap:1rem;background-color:#f9fafb;padding:1rem;border-radius:1rem;cursor:pointer;transition:all .2s ease-in-out;border:1px solid #f3f4f6}.match-card:hover{background-color:#f3f4f6;transform:translateY(-1px);box-shadow:0 4px 6px -1px #0000001a}.match-avatar{width:3rem;height:3rem;background:linear-gradient(to bottom right,#ec4899,#8b5cf6);border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0}.avatar-icon{width:1.75rem;height:1.75rem;color:#fff}.match-content{flex:1;min-width:0}.match-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:.5rem}.match-name{font-size:1.125rem;font-weight:600;color:#374151;margin:0}.match-percentage{text-align:right;flex-shrink:0}.percentage-number{font-size:1.25rem;font-weight:700;color:#ec4899;display:block;line-height:1}.percentage-label{font-size:.75rem;color:#6b7280;display:block}.match-bio{color:#6b7280;font-size:.875rem;margin:0 0 .75rem;line-height:1.4}.match-reasoning{background-color:#f0f9ff;border:1px solid #bae6fd;border-radius:.5rem;padding:.75rem;margin:.75rem 0}.match-reasoning h4{color:#0369a1;font-size:.75rem;font-weight:600;margin:0 0 .5rem;text-transform:uppercase;letter-spacing:.05em}.match-reasoning p{color:#0c4a6e;font-size:.875rem;line-height:1.4;margin:0}.match-interests{display:flex;flex-wrap:wrap;gap:.5rem}.interest-tag{background-color:#fff;color:#374151;font-size:.75rem;padding:.25rem .5rem;border-radius:.75rem;border:1px solid #e5e7eb;font-weight:500}.no-more-matches{text-align:center;margin-top:2rem;padding:1.5rem;background-color:#f9fafb;border-radius:1rem;border:1px solid #f3f4f6}.no-more-matches p{color:#6b7280;margin:0}.no-more-matches p:first-child{font-weight:500;margin-bottom:.25rem}.mutual-match{border-left:4px solid #10b981}.pending-match{border-left:4px solid #f59e0b}.match-status{display:flex;align-items:center;gap:.5rem}.status-mutual{color:#10b981;font-size:.75rem;font-weight:600}.status-pending{color:#f59e0b;font-size:.75rem;font-weight:600}.status-rejected{color:#ef4444;font-size:.75rem;font-weight:600}.rejected-match{border-left:4px solid #ef4444;opacity:.7}.match-meta{display:flex;justify-content:space-between;align-items:center;margin-top:.5rem;margin-bottom:.75rem}.scan-date{font-size:.75rem;color:#6b7280}.chat-hint{font-size:.75rem;color:#10b981;font-weight:500}.scans-summary{text-align:center;margin-top:1.5rem;padding:1rem;background-color:#f3f4f6;border-radius:.75rem;border:1px solid #e5e7eb}.scans-summary p{color:#374151;font-size:.875rem;margin:0}.form-group{margin-bottom:1rem}.form-group-grid{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;margin-bottom:1rem}.form-label{display:block;color:#9ca3af;font-size:.75rem;margin-bottom:.25rem}.form-input{width:100%;padding:.75rem;background-color:#f9fafb;border:1px solid #e5e7eb;border-radius:.5rem;font-size:.875rem;transition:border-color .2s ease-in-out}.form-input:focus{outline:none;border-color:#a855f7}.form-textarea{width:100%;padding:.75rem;background-color:#f9fafb;border:1px solid #e5e7eb;border-radius:.5rem;font-size:.875rem;resize:none;transition:border-color .2s ease-in-out}.form-textarea:focus{outline:none;border-color:#a855f7}.form-select{width:100%;padding:.75rem;background-color:#f9fafb;border:1px solid #e5e7eb;border-radius:.5rem;font-size:.875rem;transition:border-color .2s ease-in-out}.form-select:focus{outline:none;border-color:#a855f7}.btn-primary{width:100%;background:linear-gradient(to right,#ec4899,#8b5cf6);color:#fff;padding:1rem;border-radius:1rem;font-weight:600;border:none;cursor:pointer;box-shadow:0 10px 15px -3px #0000001a;transition:all .2s ease-in-out;font-size:1rem}.btn-primary:hover{box-shadow:0 20px 25px -5px #0000001a;transform:scale(.98)}.btn-primary:disabled{opacity:.6;cursor:not-allowed;transform:none}.btn-primary:disabled:hover{transform:none;box-shadow:0 10px 15px -3px #0000001a}.btn-secondary{background-color:#fff;color:#374151;padding:.75rem 1.5rem;border:1px solid #e5e7eb;border-radius:.5rem;font-weight:600;cursor:pointer;transition:all .2s ease-in-out;text-decoration:none;display:inline-block}.btn-secondary:hover{background-color:#f9fafb;text-decoration:underline}.social-buttons{display:flex;justify-content:center;gap:1rem;margin-bottom:1.5rem}.social-btn{background-color:#fff;box-shadow:0 4px 6px -1px #0000001a;padding:.75rem;border-radius:50%;border:1px solid #f3f4f6;cursor:pointer;transition:background-color .2s ease-in-out}.social-btn:hover{background-color:#f9fafb}.social-icon{width:1.5rem;height:1.5rem}.divider{display:flex;align-items:center;margin:1.5rem 0}.divider-line{flex:1;height:1px;background-color:#e5e7eb}.divider-text{padding:0 1rem;color:#9ca3af;font-size:.875rem}.text-center{text-align:center}.text-gray-500{color:#6b7280}.text-purple-600{color:#9333ea}.text-sm{font-size:.875rem}.font-semibold{font-weight:600}.mb-6{margin-bottom:1.5rem}.bottom-nav{position:fixed;bottom:0;left:0;right:0;width:100%;background-color:#fff;border-top:1px solid #e5e7eb;box-shadow:0 -4px 6px -1px #0000001a;padding:.75rem 1rem;display:flex;justify-content:space-around;align-items:center;z-index:50}.nav-button{display:flex;flex-direction:column;align-items:center;padding:.5rem;border-radius:.5rem;transition:all .2s ease-in-out;color:#6b7280;text-decoration:none;border:none;background:none;cursor:pointer}.nav-button:hover{color:#2563eb}.nav-button.active{color:#2563eb;background-color:#eff6ff}.nav-button svg{width:1.75rem;height:1.75rem}.nav-button span{font-size:.75rem;margin-top:.25rem}.custom-scrollbar::-webkit-scrollbar{width:8px}.custom-scrollbar::-webkit-scrollbar-track{background:transparent}.custom-scrollbar::-webkit-scrollbar-thumb{background-color:#cbd5e0;border-radius:10px;border:2px solid transparent;background-clip:content-box}.custom-scrollbar::-webkit-scrollbar-thumb:hover{background-color:#a0aec0}.custom-scrollbar{scrollbar-width:thin;scrollbar-color:#cbd5e0 transparent}.qr-loading{text-align:center;padding:2rem;color:#6b7280}.qr-intro{text-align:center;margin-bottom:2rem}.qr-title{font-size:1.5rem;font-weight:700;color:#374151;margin-bottom:.75rem}.qr-description{color:#6b7280;font-size:.875rem;line-height:1.5;margin-bottom:1rem}.qr-url-display{background-color:#f9fafb;padding:.75rem;border-radius:.5rem;border:1px solid #e5e7eb}.qr-url-label{font-size:.75rem;color:#6b7280;display:block;margin-bottom:.25rem}.qr-url{font-family:Courier New,monospace;font-size:.75rem;color:#374151;background-color:#fff;padding:.25rem .5rem;border-radius:.25rem;border:1px solid #d1d5db;display:block;word-break:break-all}.qr-variants-section{margin-bottom:2rem}.qr-variants-title{font-size:1.125rem;font-weight:600;color:#374151;margin-bottom:1rem;text-align:center}.qr-variants-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:1.5rem}.qr-variant-card{background-color:#f9fafb;border:2px solid #e5e7eb;border-radius:.75rem;padding:1rem;cursor:pointer;transition:all .2s ease-in-out;text-align:center}.qr-variant-card:hover{background-color:#f3f4f6;border-color:#d1d5db}.qr-variant-card.selected{border-color:#8b5cf6;background-color:#f3e8ff}.qr-variant-preview{margin-bottom:.75rem;display:flex;justify-content:center}.qr-variant-header{display:flex;align-items:center;justify-content:center;gap:.5rem;margin-bottom:.25rem}.qr-variant-icon{font-size:1rem}.qr-variant-name{font-weight:600;color:#374151;font-size:.875rem}.qr-variant-description{color:#6b7280;font-size:.75rem;margin:0}.qr-actions{margin-bottom:2rem}.qr-secondary-actions{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;margin-top:1rem}.qr-tshirt-ideas{margin-bottom:2rem}.qr-section-title{font-size:1.125rem;font-weight:600;color:#374151;margin-bottom:1rem;text-align:center}.qr-ideas-grid{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.qr-idea-card{background-color:#fef3c7;border:1px solid #fbbf24;border-radius:.5rem;padding:1rem;text-align:center}.qr-idea-icon{font-size:1.5rem;margin-bottom:.5rem}.qr-idea-title{font-weight:600;color:#92400e;font-size:.875rem;margin:0 0 .25rem}.qr-idea-text{color:#b45309;font-size:.75rem;margin:0}.qr-tips{margin-bottom:2rem}.qr-tips-grid{display:grid;grid-template-columns:1fr;gap:.75rem}.qr-tip{background-color:#ecfdf5;border:1px solid #a7f3d0;border-radius:.5rem;padding:.75rem;font-size:.875rem;color:#065f46}@media (max-width: 640px){.app-container{padding:0}.main-card{margin:-2rem 0 6rem;padding:1rem}.form-group-grid{grid-template-columns:1fr;gap:1rem}.qr-variants-grid,.qr-secondary-actions,.qr-ideas-grid{grid-template-columns:1fr}.qr-code-container{max-width:250px}}.qr-code-container{display:flex;justify-content:center;width:100%;max-width:280px;margin:1rem auto}.qr-code{width:100%!important;height:auto!important;max-width:100%}.qr-code canvas{width:100%!important;height:auto!important;max-width:100%}