:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh;background-color:#f7f6f4}h1{font-size:3.2em;line-height:1.1}#root{width:100%;margin:0 auto}.mbti-container{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;background-color:#f7f6f4;color:#2b2b2b;font-family:Inter,sans-serif;padding:20px}.mbti-center{justify-content:center}.mbti-intro,.mbti-quiz,.mbti-result,.mbti-loading{background:#fff;border-radius:20px;padding:40px;max-width:500px;width:100%;text-align:center;box-shadow:0 10px 30px #0000000d;animation:fadeIn .5s ease-out}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.mbti-emoji-header{font-size:4rem;margin-bottom:20px}.mbti-intro h1{font-size:1.8rem;color:#2b2b2b;margin-bottom:10px}.mbti-subtitle{color:#708a7e;font-weight:600;margin-bottom:30px}.mbti-intro-box{background:#f9f9f9;padding:20px;border-radius:12px;margin-bottom:30px;line-height:1.6}.mbti-btn-primary{width:100%;padding:16px;background-color:#2b2b2b;color:#fff;border:none;border-radius:12px;font-size:1.1rem;font-weight:700;cursor:pointer;transition:all .2s;margin-bottom:15px}.mbti-btn-primary:hover{background-color:#000;transform:translateY(-2px)}.mbti-btn-secondary{width:100%;padding:16px;background-color:#f7f6f4;color:#2b2b2b;border:1px solid #ddd;border-radius:12px;font-size:1.1rem;font-weight:700;cursor:pointer;transition:all .2s;margin-bottom:15px}.mbti-btn-secondary:hover{background-color:#efefef}.mbti-btn-text{background:none;border:none;color:#a1a1a1;text-decoration:underline;cursor:pointer;font-size:.9rem;padding:10px}.mbti-progress-bar{width:100%;height:8px;background-color:#efefef;border-radius:4px;margin-bottom:10px;overflow:hidden}.mbti-progress-fill{height:100%;background-color:#708a7e;transition:width .3s ease}.mbti-question-count{font-size:.9rem;color:#a1a1a1;margin-bottom:30px;text-align:right}.mbti-question-text{font-size:1.4rem;line-height:1.4;margin-bottom:40px;min-height:80px;display:flex;align-items:center;justify-content:center}.mbti-answers{display:flex;flex-direction:column;gap:15px}.mbti-answer-btn{padding:20px;background-color:#fcfcfc;border:2px solid #efefef;border-radius:12px;font-size:1.05rem;cursor:pointer;transition:all .2s;color:#2b2b2b;text-align:center;word-break:keep-all}.mbti-answer-btn:hover,.mbti-answer-btn:active{border-color:#b9a27b;background-color:#faf7f2}.mbti-loading h2{margin-top:20px;color:#4d5c75}.mbti-spinner{font-size:3rem;animation:spin 1.5s linear infinite;display:inline-block}@keyframes spin{0%{transform:scale(1) rotate(0)}50%{transform:scale(1.2) rotate(180deg)}to{transform:scale(1) rotate(360deg)}}.mbti-result-card{background:#fafafa;border-radius:16px;padding:30px 20px;margin:20px 0 30px}.mbti-result-gif-container{width:150px;height:150px;margin:0 auto 20px;border-radius:50%;overflow:hidden;box-shadow:0 8px 20px #0000001a;background-color:#fff;border:4px solid #fff;animation:bounce 2s infinite ease-in-out}.mbti-result-gif{width:100%;height:100%;object-fit:cover}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.mbti-result-subtitle{color:#b9a27b;font-size:1.1rem;margin-bottom:5px}.mbti-result-name{font-size:2.2rem;color:#2b2b2b;margin-bottom:20px}.mbti-result-desc{font-size:1rem;line-height:1.6;color:#4d5c75;margin-bottom:30px}.mbti-chemistry{display:flex;gap:10px;justify-content:space-between}.mbti-chem-box{flex:1;padding:15px;border-radius:12px;font-size:.9rem;display:flex;flex-direction:column;align-items:center;gap:8px;cursor:pointer;transition:all .2s}.mbti-chem-box:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000000d}.mbti-chem-box.active.good{border-color:#b9a27b;background-color:#e5f0eb}.mbti-chem-box.active.bad{border-color:#b9a27b;background-color:#fae6e6}.mbti-chem-box.good{background-color:#f0f7f4;color:#2b2b2b;border:2px solid #e0ece6}.mbti-chem-box.bad{background-color:#fff0f0;color:#2b2b2b;border:2px solid #fee1e1}.mbti-chem-box span{font-size:.8rem;color:#777}.mbti-reason-box{margin-top:15px;margin-bottom:25px;padding:20px;border-radius:12px;font-size:.95rem;line-height:1.5;animation:fadeIn .3s ease-out;text-align:left}.mbti-reason-animal{display:flex;flex-direction:column;align-items:center;margin-bottom:14px;gap:6px}.mbti-reason-animal-img{width:100px;height:100px;object-fit:cover;border-radius:50%;border:3px solid #fff;box-shadow:0 4px 12px #0000001a}.mbti-reason-animal-name{font-size:.85rem;font-weight:700;color:#4d5c75}.mbti-reason-box b{display:block;margin-bottom:8px;font-size:1.05rem}.mbti-reason-box.good{background:#f0f7f4;border:1px dashed #B9A27B;color:#2b2b2b}.mbti-reason-box.bad{background:#fff0f0;border:1px dashed #B9A27B;color:#2b2b2b}.mbti-actions{display:flex;flex-direction:column}