.face-intro{text-align:center;background:linear-gradient(135deg, var(--primary) 0%, var(--primary) 50%, var(--primary) 100%);color:#fff;border-radius:15px;margin:30px 0;padding:50px 20px}.face-deco{filter:drop-shadow(0 4px 8px #0003);margin-bottom:15px;font-size:4em}.intro-text{margin-bottom:30px;font-size:1.3em;line-height:1.8}.test-info{flex-wrap:wrap;justify-content:center;gap:30px;margin:30px 0;display:flex}.test-info p{margin:5px 0;font-size:1.1em}.btn-primary{color:var(--primary);cursor:pointer;background:#fff;border:none;border-radius:30px;padding:15px 40px;font-size:1.2em;font-weight:700;transition:transform .2s,box-shadow .2s}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 5px 15px #0000004d}.progress-bar{background:#e0e0e0;border-radius:5px;width:100%;height:10px;margin-bottom:20px;overflow:hidden}.progress-fill{background:linear-gradient(90deg, var(--primary), var(--primary), var(--primary));width:0%;height:100%;transition:width .3s}.question-counter{text-align:center;color:#666;margin-bottom:30px;font-size:1.2em}.question-container{padding:40px 20px}.question-container h2{text-align:center;color:#333;margin-bottom:40px;font-size:1.4em;line-height:1.6}.options{flex-direction:column;gap:12px;max-width:600px;margin:0 auto;display:flex}.option-btn{cursor:pointer;background:#fff;border:2px solid #e0e0e0;border-radius:10px;padding:18px;font-size:1.1em;transition:all .2s}.option-btn:hover{background:linear-gradient(135deg, #fffbeb 0%, var(--primary) 100%);border-color:var(--primary);transform:translate(5px)}.result-container{text-align:center;padding:40px 20px}.face-result-visual{background:linear-gradient(135deg, var(--primary) 0%, var(--primary) 50%, var(--primary) 100%);border-radius:50%;flex-direction:column;justify-content:center;align-items:center;width:200px;height:200px;margin:0 auto 30px;animation:2s ease-in-out infinite faceGlow;display:flex;box-shadow:0 8px 30px #00000014}@keyframes faceGlow{0%,to{box-shadow:0 8px 30px #00000014}50%{box-shadow:0 8px 50px #00000014}}.face-result-emoji{margin-bottom:5px;font-size:3em}.face-result-name{color:#fff;text-shadow:0 2px 6px #0000004d;font-size:1.2em;font-weight:700}.result-detail{margin-bottom:30px}.result-detail h2{color:var(--primary);margin-bottom:15px;font-size:1.6em}.result-desc{color:#555;max-width:600px;margin:0 auto;font-size:1.1em;line-height:1.8}.fortune-section{background:linear-gradient(135deg, #fffbeb 0%, var(--primary) 100%);border:1px solid #f59e0b33;border-radius:15px;margin-bottom:25px;padding:25px}.fortune-section h3{color:var(--primary);margin-bottom:15px}.fortune-text{color:var(--primary);font-size:1.15em;font-weight:600}.traits-section{background:#f8f9fa;border-radius:15px;margin-bottom:25px;padding:25px}.traits-section h3{color:var(--primary);margin-bottom:15px}.traits-list{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.trait-tag{background:linear-gradient(135deg, var(--primary) 0%, var(--primary) 100%);color:#fff;border-radius:20px;padding:8px 16px;font-size:.95em}.advice-section{text-align:left;background:linear-gradient(135deg,#f8f9fa 0%,#e9ecef 100%);border-radius:15px;margin-bottom:25px;padding:25px}.advice-section h3{color:var(--primary);text-align:center;margin-bottom:15px}.advice-list{padding:0;list-style:none}.advice-list li{color:#555;border-bottom:1px solid #e0e0e0;padding:8px 0;line-height:1.6}.advice-list li:last-child{border-bottom:none}.advice-list li:before{content:"&#9758; ";color:var(--primary)}.compatibility-section{margin-bottom:25px}.compatibility-section h3{color:var(--primary);margin-bottom:15px}.compat-text{color:#555;font-size:1.1em;line-height:1.7}#retry-btn{background:linear-gradient(135deg, var(--primary) 0%, var(--primary) 100%);color:#fff;margin-top:20px}.content-section{max-width:800px;margin:40px auto;line-height:1.8}.content-section h2{color:var(--primary);margin-top:35px;margin-bottom:15px;font-size:1.4em}.content-section p{color:#555;margin-bottom:15px}.content-section ul{margin-bottom:15px;padding-left:20px}.content-section li{color:#555;margin-bottom:10px}@media (width<=768px){.test-info{flex-direction:column;gap:10px}.intro-text{font-size:1.1em}.face-result-visual{width:160px;height:160px}.face-result-emoji{font-size:2.4em}.face-result-name{font-size:1em}.face-deco{font-size:3em}}