.landing-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px}.landing-container{background:#1a1a1a;border-radius:20px;padding:50px 40px;box-shadow:0 20px 60px #000c;border:1px solid #2a2a2a;max-width:800px;width:100%;text-align:center}.landing-container h1{color:#f59e0b;margin-bottom:30px;font-size:2.5rem}.explanation-section{text-align:left;margin-bottom:40px}.explanation-section h2{color:#f59e0b;margin-bottom:20px;font-size:1.8rem;text-align:center}.rules-content{color:#e5e5e5;line-height:1.8;font-size:1.1rem}.rules-content p{margin-bottom:15px}.rules-content ul,.rules-content ol{margin:15px 0;padding-left:30px}.rules-content li{margin-bottom:10px}.rules-content strong{color:#f59e0b}.continue-button{background:#f59e0b;color:#0f0f0f;border:none;padding:16px 40px;border-radius:8px;font-size:1.1rem;font-weight:600;cursor:pointer;transition:transform .2s,box-shadow .2s,background .2s}.continue-button:hover{transform:translateY(-2px);box-shadow:0 10px 20px #f59e0b66;background:#fbbf24}.continue-button:active{transform:translateY(0)}@media (max-width: 768px){.landing-page{padding:20px 15px 15px;align-items:flex-start}.landing-container{padding:30px 20px;border-radius:12px;max-width:100%}.landing-container h1{font-size:1.8rem;margin-bottom:20px}.explanation-section h2{font-size:1.5rem;margin-bottom:15px}.rules-content{font-size:1rem;line-height:1.6}.continue-button{padding:14px 32px;font-size:1rem;width:100%}}.homepage{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px}.homepage-container{background:#1a1a1a;border-radius:20px;padding:40px;box-shadow:0 20px 60px #000c;border:1px solid #2a2a2a;max-width:500px;width:100%}.homepage-container h1{color:#f59e0b;margin-bottom:10px;text-align:center;font-size:2.5rem}.subtitle{text-align:center;color:#a0a0a0;margin-bottom:30px;font-size:1.1rem}.homepage-form{display:flex;flex-direction:column;gap:20px}.form-group{display:flex;flex-direction:column;gap:8px}.form-group label{font-weight:600;color:#e5e5e5;font-size:.95rem}.form-group input,.form-group select{padding:12px 16px;border:2px solid #3a3a3a;border-radius:8px;font-size:1rem;background:#252525;color:#e5e5e5;transition:border-color .3s}.form-group input:focus,.form-group select:focus{outline:none;border-color:#f59e0b;background:#2a2a2a}.form-group input::placeholder{color:#666}.form-group input.error,.form-group select.error{border-color:#e74c3c}.error-message{color:#e74c3c;font-size:.85rem;margin-top:-4px}.start-button{background:#f59e0b;color:#0f0f0f;border:none;padding:16px;border-radius:8px;font-size:1.1rem;font-weight:600;cursor:pointer;transition:transform .2s,box-shadow .2s,background .2s;margin-top:10px}.start-button:hover{transform:translateY(-2px);box-shadow:0 10px 20px #f59e0b66;background:#fbbf24}.start-button:active{transform:translateY(0)}@media (max-width: 768px){.homepage{padding:20px 15px 15px;align-items:flex-start}.homepage-container{padding:25px 20px;border-radius:12px;max-width:100%}.homepage-container h1{font-size:1.8rem;margin-bottom:8px}.subtitle{font-size:.95rem;margin-bottom:25px}.homepage-form{gap:16px}.form-group label{font-size:.9rem}.form-group input,.form-group select{padding:10px 14px;font-size:.95rem}.start-button{padding:14px;font-size:1rem;margin-top:8px}}.ab-test-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px}.ab-test-container{background:#1a1a1a;border-radius:20px;padding:40px;box-shadow:0 20px 60px #000c;border:1px solid #2a2a2a;max-width:1200px;width:100%}.ab-test-container h2{color:#f59e0b;margin-bottom:10px;text-align:center;font-size:2rem}.instruction{text-align:center;color:#a0a0a0;margin-bottom:30px;font-size:1.1rem}.photos-container{display:grid;grid-template-columns:repeat(2,1fr);gap:30px;margin-bottom:20px}.photo-wrapper{position:relative;cursor:pointer;border-radius:12px;overflow:hidden;transition:transform .3s,box-shadow .3s,opacity .3s;border:3px solid transparent}.photo-wrapper:hover{transform:translateY(-5px);box-shadow:0 15px 30px #0003}.photo-wrapper.selected{border-color:#f59e0b;box-shadow:0 0 0 4px #f59e0b4d}.photo-wrapper.dimmed{opacity:.5;cursor:not-allowed}.test-photo{width:100%;height:400px;object-fit:cover;display:block}.photo-label{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(to top,rgba(0,0,0,.7),transparent);color:#fff;padding:15px;text-align:center;font-weight:600;font-size:1.1rem}.photo-error{width:100%;height:400px;display:flex;align-items:center;justify-content:center;background:#252525;color:#666;text-align:center;font-size:1.2rem}.loading,.submitting{text-align:center;color:#f59e0b;font-size:1.2rem;padding:20px}@media (max-width: 768px){.photos-container{grid-template-columns:1fr;gap:20px}.ab-test-container{padding:20px;border-radius:12px}.ab-test-container h2{font-size:1.5rem;margin-bottom:8px}.instruction{font-size:1rem;margin-bottom:20px}.test-photo{height:300px}.photo-label{padding:12px;font-size:1rem}.loading,.submitting{font-size:1rem;padding:15px}}.end-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px}.end-container{background:#1a1a1a;border-radius:20px;padding:60px 40px;box-shadow:0 20px 60px #000c;border:1px solid #2a2a2a;max-width:600px;width:100%;text-align:center}.end-container h1{color:#f59e0b;margin-bottom:20px;font-size:2.5rem}.end-message{color:#a0a0a0;margin-bottom:40px;font-size:1.2rem;line-height:1.6}.start-over-button{background:#f59e0b;color:#0f0f0f;border:none;padding:16px 32px;border-radius:8px;font-size:1.1rem;font-weight:600;cursor:pointer;transition:transform .2s,box-shadow .2s,background .2s}.start-over-button:hover{transform:translateY(-2px);box-shadow:0 10px 20px #f59e0b66;background:#fbbf24}.start-over-button:active{transform:translateY(0)}@media (max-width: 768px){.end-page{padding:20px 15px 15px;align-items:flex-start}.end-container{padding:30px 20px;border-radius:12px;max-width:100%}.end-container h1{font-size:1.8rem;margin-bottom:15px}.end-message{font-size:1rem;margin-bottom:30px;line-height:1.5}.start-over-button{padding:14px 24px;font-size:1rem;width:100%}}*{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;background:#0f0f0f;min-height:100vh;color:#e5e5e5}#root{min-height:100vh}
