.tool-header{text-align:center;margin-bottom:40px}.header-badge{display:flex;justify-content:center;gap:12px;margin-bottom:24px;flex-wrap:wrap}.badge{background:linear-gradient(135deg, #667eea, #764ba2);color:white;padding:6px 18px;border-radius:40px;font-size:0.75rem;font-weight:500}.tool-header h1{font-size:2.2rem;font-weight:800;background:linear-gradient(135deg, #1e293b, #667eea);-webkit-background-clip:text;background-clip:text;color:transparent}.tool-header p{color:var(--gray-500)}.start-card{background:linear-gradient(135deg, #667eea, #764ba2);border-radius:40px;padding:48px;text-align:center;color:white;margin-bottom:24px}.start-card-inner{max-width:600px;margin:0 auto}.start-icon{width:80px;height:80px;background:rgba(255,255,255,0.2);border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 24px;font-size:2rem}.start-card h2{font-size:1.8rem;margin-bottom:12px}.start-features{display:flex;justify-content:center;gap:24px;flex-wrap:wrap;margin:24px 0}.feature{background:rgba(255,255,255,0.15);padding:8px 20px;border-radius:40px;font-size:0.85rem}.feature i{margin-right:6px}.start-btn{background:white;color:#667eea;padding:14px 40px;font-size:1.1rem;box-shadow:0 8px 25px rgba(0,0,0,0.2)}.start-btn:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(0,0,0,0.25)}.start-note{font-size:0.7rem;opacity:0.8;margin-top:20px}.test-card{background:white;border-radius:32px;padding:32px;box-shadow:0 20px 40px -12px rgba(0,0,0,0.1)}.test-progress{margin-bottom:32px}.progress-info{text-align:center;font-size:1.2rem;font-weight:600;color:var(--primary-color);margin-bottom:12px}.progress-bar{height:8px;background:var(--gray-200);border-radius:4px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg, #667eea, #764ba2);border-radius:4px;transition:width 0.3s ease}.progress-dimensions{display:flex;justify-content:space-between;margin-top:16px;font-size:0.75rem;font-weight:600;color:var(--gray-400)}.dimension.E,.dimension.I{color:#667eea}.dimension.S,.dimension.N{color:#10b981}.dimension.T,.dimension.F{color:#f59e0b}.dimension.J,.dimension.P{color:#ef4444}.question-container{min-height:300px}.question-text{font-size:1.2rem;font-weight:500;line-height:1.5;margin-bottom:32px;color:var(--gray-800)}.options-list{display:flex;flex-direction:column;gap:16px}.option-item{display:flex;align-items:center;gap:16px;padding:16px 20px;border:2px solid var(--gray-200);border-radius:60px;cursor:pointer;transition:all 0.2s}.option-item:hover{border-color:#667eea;background:#f8fafc}.option-item.selected{border-color:#667eea;background:linear-gradient(135deg, #f0f4ff, #fff)}.option-letter{width:40px;height:40px;background:var(--gray-100);border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:700;color:var(--gray-600)}.option-item.selected .option-letter{background:#667eea;color:white}.option-text{flex:1;font-size:0.95rem}.test-nav{display:flex;justify-content:space-between;margin-top:32px}.nav-btn{background:var(--gray-100);border:none;padding:12px 28px;border-radius:40px;font-weight:500;cursor:pointer;transition:all 0.2s}.nav-btn.prev:hover{background:var(--gray-200)}.nav-btn.next{background:linear-gradient(135deg, #667eea, #764ba2);color:white}.nav-btn.next:hover{transform:translateX(4px)}.result-card{background:white;border-radius:32px;padding:32px;box-shadow:0 20px 40px -12px rgba(0,0,0,0.1)}.result-header{text-align:center;margin-bottom:32px}.result-type{font-size:3rem;font-weight:800;color:#667eea;letter-spacing:4px}.result-title{font-size:1.5rem;font-weight:600;margin:8px 0}.result-subtitle{color:var(--gray-500)}.dimension-scores{background:var(--gray-50);border-radius:24px;padding:24px;margin-bottom:32px}.dimension-row{display:flex;align-items:center;gap:16px;margin-bottom:20px}.dimension-row:last-child{margin-bottom:0}.dimension-name{width:60px;font-weight:700;color:#667eea}.dimension-name span{font-size:0.7rem;font-weight:normal;color:var(--gray-500);margin-left:4px}.dimension-name.right{text-align:right;color:#764ba2}.dimension-bar-wrapper{flex:1;display:flex;align-items:center;gap:12px}.dimension-bar{flex:1;height:8px;background:var(--gray-200);border-radius:4px;overflow:hidden}.dimension-fill{height:100%;background:linear-gradient(90deg, #667eea, #764ba2);border-radius:4px}.dimension-value{width:45px;font-size:0.8rem;font-weight:600;color:var(--gray-600)}.result-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:24px;border-bottom:1px solid var(--gray-200);padding-bottom:12px}.result-tab{background:transparent;border:none;padding:8px 20px;border-radius:40px;cursor:pointer;font-size:0.85rem;transition:all 0.2s}.result-tab.active{background:#667eea;color:white}.tab-content{animation:fadeIn 0.3s ease}.tab-content-inner{line-height:1.6;color:var(--gray-600)}.tab-content-inner h4{color:var(--gray-800);margin:20px 0 12px;display:flex;align-items:center;gap:8px}.tab-content-inner ul{margin-left:20px;margin-bottom:20px}.tab-content-inner li{margin-bottom:8px}.advice-text{background:var(--gray-50);padding:16px;border-radius:16px;margin:12px 0}.result-actions{display:flex;justify-content:center;gap:16px;margin-top:32px;padding-top:24px;border-top:1px solid var(--gray-200);flex-wrap:wrap}@keyframes fadeIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media (max-width:768px){.start-card{padding:32px 24px}.start-card h2{font-size:1.4rem}.start-features{gap:12px}.feature{font-size:0.7rem;padding:6px 14px}.test-card{padding:20px}.question-text{font-size:1rem}.option-item{padding:12px 16px}.option-text{font-size:0.85rem}.dimension-row{flex-wrap:wrap}.dimension-name{width:auto}.dimension-name.right{text-align:left}.result-type{font-size:2rem}.result-tabs{justify-content:center}.result-tab{padding:6px 14px;font-size:0.75rem}}